Embedding Widget in Apps
Ready to use chat widgets for your Apps.
You can embed the out of the box widget that the platform can serve in a mobile or tablet apps too. This is done by calling the responsive widget URL served by the dhee.world domain in your web views.
E.g, embedding https://{your-bot-instance}.dhee.world in a web-view in your app will show a widget like this-
The background colour around your widget can be changed by adding a GET parameter named bgColor.
The bgColor parameter has to be set to the hex code of the colour you want (without prefixing with the # symbol"
E.g, https://mybot.dhee.world?bgColor=0d66d5
To remove the halo and the background from the default widget and display a fullscreen widget, you just need to add a GET parameter named fullscreen. The value of the parameter should always be set to true.
E.g, https://mybot.dhee.world?fullscreen=true
Many times, you would want to launch a chatbot for engaging users who are already logged in to your App. In such cases you can let Dhee be aware that you are launching the bot for a given logged-in user. This is done by sending the user's details in a JSON string, after encrypting it using AES encryption. The encrypted payload should then be included in the dhee.world URL as a GET parameter "payload".
The flavour of AES we are using is AES-CBC, which requires the encrypting side to include an Initialisation Vector, which is a Byte array of size 16.
The JSON payload to be encrypted, should be of the format:
{
userName:"loggedInUsersFullName",
language:"loggedInUsersLanguagePreference",
contactNumber:"loggedInUsersContactNumber",
userInfoParam1:"Some information of use in Dialog automation, like app userId",
userInfoParam2:"Some other information of user in dialog automation",
userInforParamN:"yet another information"
}
Parameter | Remarks |
|---|---|
userName | The full name of the logged in user. |
language | |
contactNumber | The mobile number of the logged in user. If not available please set is as "0000000000" (ten zeroes) |
Additional custom parameters | Any additional parameters that you provide will be made available to your Dialog state machines as a slot with the same parameter name. Please make sure the parameter names are single words in camel case. |
The GET request should have the following header:
key-vec:{Base64 encoded value of the byte array used as Init Vector}
As hinted above, the value of the header key-vec should be the base-64 encrypted form of your initialisation vector.
The key used for AES encryption has to pre-configured in the Dhee developer platform in the Agent Settings/Advanced Settings Page, as the WEB_VIEW_KEY parameter
As you can see from the screenshot below, this parameter will be auto-generated for you if you edit and save this field in the Advanced Setting page.
web-view payload encryption key
GET /?payload=JxOQINPDFhJs2Ozwd7X97m6SOCKSn7k2M8N90iD9gs1+Tnffp9JMgQC6NN4dKyXqJwMcnu32IpWvrkT3jLwI+g==&fullsreen=true HTTP/1.1
Host: mybot.dhee.world
key-vec: FQQWV9gToG3RMT+I0+bi0w==
Last modified 1yr ago