Chatterbox lets you securely embed Hydrogen within any website.
To use Chatterbox you will need:
- A homeserver which supports Token-authenticated registration. Currently the only known implementation is Synapse.
- An account on that homeserver which can create registration tokens. Synapse requires the account to be an admin.
- Clone the repo.
- Install dependencies (you only need to do this once):
yarn install
- Modify config.json in
public
directory with your homeserver details.
(Seetypes/IChatterboxConfig.ts
for the format) - Start develop server:
yarn start
Follow the develop instructions above (steps 1-3), then:
- Build chatterbox app into
/target
directory:yarn build
Assuming that the build output (inside /target
) is hosted at <root>
(eg: chatterbox.element.io), copy and paste the following snippet before the closing </body>
tag:
<script>
window.CHATTERBOX_CONFIG_LOCATION = "path_to_config";
</script>
<script src="<root>/assets/parent.js" type="module" id="chatterbox-script"></script>
Chatterbox comes with a suite of integration tests, using cypress.
You can run them by doing
yarn cypress install
yarn cypress open
Ensure you copy the cypress/fixtures/demoInstance.sample.json
file to cypress/fixtures/demoInstance.json
and edit
the keys accordingly.
Chatterbox makes use of the Token-authenticated registration feature, and as such your homeserver implementation will need to support it.
Synapse has supported this feature since at least 1.52.0. You can enable token registration in homeserver config with:
registration_requires_token: true
You will also need to manually create a registration token with the create token API. You must use the access token of an administatator for this. See the Synapse documentation for help.
$ curl --data '{ "uses_allowed": 50 }' -H 'Authorization: Bearer YOUR_ADMIN_TOKEN' 'https://your-homeserver/_synapse/admin/v1/registration_tokens/new'
200 OK
{
"token": "defg",
"uses_allowed": 50,
"pending": 0,
"completed": 0,
"expiry_time": null
}
Note that you can use uses_allowed
to set how many chatterbox users can register via this token before no more will be permitted.
You can then use the value of token
in the response inside your config.json
.