Embedding Configuration
Defines how to configure the embedded chat interface using GET parameters at load time and postMessage for dynamic, session-based updates.
GET Parameters Overview
The GET parameters for our chat application consist of both obligatory and optional parameters. These parameters allow for customization of the chat interface, user identification, room identification, language selection, interface mode, and more. For specific functions such as audio streaming, there are additional parameters available.
Required Parameters
These parameters are required for the chatroom to function properly:
Parameter | Type | Required | Description |
---|---|---|---|
userId | string | Yes | A unique identifier for the user in the partner's app. This can be an encrypted ID. The ID must be no longer than 255 characters, and can consist of Latin, Cyrillic, or special characters. No restrictions are set on the character types that can be used. |
roomid | string | Yes | A unique identifier for the chatroom in the partner's app. This ID must be no longer than 255 characters, and can consist of Latin, Cyrillic, or special characters. No restrictions are set on the character types that can be used. |
apikey | string | Yes | API key which you can obtain from Watchers manager |
Optional GET Parameters
Parameter | Type | Required | Enabled by Admin Panel | Description |
---|---|---|---|---|
| string | No | No | An optional language setting for the interface. This parameter can be used to set a default language for the chat interface. Supported languages adhere to ISO 639-1 language codes. More on ISO Language Codes. Supported languages: English (en), Serbian (sr), Armenian (hy), French (fr), Finnish (fi), Russian (ru), Spanish (es), German (de), Arabic (ar), Turkish (tr), Hindi (hi), Romanian (ro), Portuguese (pt), Chinese (zh), Malay (ms), Thai (th), Korean (ko), Icelandic (is), Polish (pl), Ukrainian (uk), Uzbek (uz), Azerbaijani (az), Japanese (ja), Bengali (bn) |
| boolean | No | No | When set to |
| string | No | No | An optional title for the chat room, displayed in the admin panel for easier navigation by moderators. Limited to 255 characters, with no restrictions on character types (Latin, Cyrillic, or special characters). |
| string | No | No | An optional interface mode setting. Options include "dark" for dark mode and "light" for light mode. This parameter sets a default mode for the chat interface, with the ability for users to change it if enabled. |
| boolean | No | No | When set to true, this optional mode disables all interface controls except the arrow button for navigating to the latest messages. Users can only read messages without interacting with the chat. Useful for public broadcasts, archiving, and moderation. If |
| string | No | Yes | Must be provided if OAUTH authorization is enabled. |
| string | No | Yes | |
| string | No | Yes | |
| string | No | Yes | |
| string | No | Yes | See additional information below. |
| string | No | Yes | See additional information below. |
| string | No | Yes | Allows choosing how odds are displayed: |
By adhering to these integration protocols, partners can efficiently incorporate existing user properties into our platform via GET parameters, facilitating a user experience that is both personalized and coherent.
Runtime Configuration via postMessage
postMessage
In addition to GET parameters used during iframe initialization, the embedded chat supports runtime updates via the browser’s postMessage
API. This enables dynamic changes to interface settings such as theme, language, and odds format — without reloading the chat or losing current session state.
Supported message types
Each message must be sent from the parent window to the iframe and follow this JSON structure:
{
"type": "<setting>",
"body": {
"data": "<value>"
}
}
type | body.data values | Description |
---|---|---|
mode | light or dark | Updates the interface theme |
lang | ISO 639-1 code (e.g. en ) | Changes the language of the chat interface |
oddsFormat | decimal or american | Adjusts the odds display format |
Behavior
- These updates are session-scoped and take effect immediately without reloading the iframe.
- The chat preserves input state, message history, and scroll position.
- On full page reload, settings revert to values passed via the GET parameters.
Example
iframeEl.contentWindow.postMessage({
type: 'mode',
body: { data: 'dark' }
}, '*');
Security note: Always validate
event.origin
on the receiving end to ensure messages are from trusted sources.
Example Listener in Parent Window
To handle dynamic configuration updates, implement a listener for message
events in the parent window:
window.addEventListener("message", (event) => {
const { type, body } = event.data || {};
if (!type || !body?.data) return;
switch (type) {
case "mode":
console.log("Theme changed to:", body.data);
// Update UI theme or store the preference
break;
case "lang":
console.log("Language changed to:", body.data);
// Update UI language or trigger i18n update
break;
case "oddsFormat":
console.log("Odds format changed to:", body.data);
// Update display logic for odds formatting
break;
default:
// Ignore unknown message types
break;
}
});
This listener enables the parent application to react to configuration changes if needed. For simple iframe communication, it is not required — the embedded chat handles updates internally.
Updated 13 days ago