This document provides instructions on setting up the JavaScript SDK (referred to as "SDK" hereafter). The SDK facilitates the integration of a channel button into your web service.
Choose one of the two methods below to install the SDK:
If your web service spans multiple pages, with each page loading fresh static resources upon request, follow this guide.
Note: Web services operating in this manner are termed as MPAs
Dive deeper into MPA(Multi-Page Application) for more insights.
Insert the following script within the <body> tag of your HTML file:
Initialize the SDK with the boot method. The type of user is discerned based on the presence or absence of the memberId field in the given object.
To set up the SDK for anonymous users:
To set up the SDK for member users:
To integrate users between your web service and Channel Talk, populate the boot option with relevant user information. Refer to memberId and profile for more details.
Security Alert: Use member hash for enhanced security
If you employ predictable memberId values like user IDs or emails, unauthorized access to this data poses a security risk. To mitigate this, enable member hash for your channel.
Note: User Data Unification
Transitioning from an anonymous user to a member user state allows Channel Talk to unify these users under certain conditions. Refer to unifying customer information for more information.
Refer to the boot and boot option sections for comprehensive information about boot. Browse ChannelIO for various methods provided by the SDK.
For web services designed as Single Page Application(SPA) or if you intend to use the SDK via the JavaScript Class, follow the instructions below:
Heads Up: Use the SDK only on the client side.
Server-side execution is not supported.
Install the SDK using the Service.
Initialize the SDK with the boot method. The type of user is discerned based on the presence or absence of the memberId field in the given object.
To set up the SDK for anonymous users:
To set up the SDK for member users:
To integrate users between your web service and Channel Talk, populate the boot option with relevant user information. Refer to memberId and profile for more details.
Security Alert: Use member hash for enhanced security
If you employ predictable memberId values like user IDs or emails, unauthorized access to this data poses a security risk. To mitigate this, enable member hash for your channel.
Note: User Data Unification
Transitioning from an anonymous user to a member user state allows Channel Talk to unify these users under certain conditions. Refer to unifying customer information for more information.
To utilize the workflow and marketing features in an SPA environment, you must use the setPage and track methods.
In an SPA environment, the SDK and Channel Talk server cannot automatically detect URL changes. For more details, please refer to How to Use the Workflow and Marketing Features in an SPA Environment.
Refer to the boot and boot option sections for comprehensive information about boot. Browse ChannelIO for various methods provided by the SDK.
Install the Channel Web SDK Loader NPM module.
npm install @channel.io/channel-web-sdk-loaderyarn add @channel.io/channel-web-sdk-loaderpnpm i @channel.io/channel-web-sdk-loaderImport channel-web-sdk-loader and call the loadScript function.
Initialize the SDK using the boot method. The user type is determined by the presence or absence of the memberId field in the passed object.
To initialize the SDK for anonymous users, use the following code:
To initialize the SDK for member users, use the following code:
To integrate users between your web service and ChannelTalk, populate the boot option with relevant user information. Refer to memberId and profile for more details.
Security Alert: Use member hash for enhanced security
If you employ predictable memberId values like user IDs or emails, unauthorized access to this data poses a security risk. To mitigate this, enable member hash for your channel.
Note: User Data Unification
Transitioning from an anonymous user to a member user state allows Channel Talk to unify these users under certain conditions. Refer to unifying customer information for more information.
For a detailed guide on using NPM modules, visit GitHub or npm. Consult the TypeDoc for API documentation.