Chat Widget SDK Reference
FrontChat('init', options)
By default, the chat launcher will become visible immediately after the page loads. This is not always desirable if you want to use an alternative button or delay when the chat becomes available. If you don't call the init
method, useDefaultLauncher
will be true by default.
Note: You should only call init
once per page load unless you are using the shutdown
method.
FrontChat('init', {
useDefaultLauncher: false // optional
});
Options you can pass through init
- shouldShowWindowOnLaunch
Automatically opens the chat window on initialization. - shouldExpandOnShowWindow
Opens the chat in the expanded state by default. - shouldHideCloseButton
Ensures that the close chevron button is hidden on initialization. - shouldHideExpandButton
Ensures that the Expand button is hidden on initialization. - welcomeMessageAppearance
By default, the welcome message is displayed upon initialization. When the user closes the welcome message it will stay closed for the duration of their session. To change this behavior, set this option to:hidden
: Never display the welcome message.always
: Display the welcome message every time a user navigates to the page.
- isMobileWebview
Indicates to the widget that it has been launched in a mobile webview. For now, this automatically prevents the attachments button from attempting to open the file in a new window, and instead fallbacks to a normal file download. - useDefaultLauncher
By default, the chat launcher will become visible immediately after the page loads. This is not always desirable if you want to use an alternative button or delay when the chat becomes available. If auseDefaultLauncher
parameter is not included in the options, it will betrue
by default. - onInitCompleted
This is a callback function that will be run once the chat application has fully initialized. This can be used to ensure that subsequent SDK commands are only run once the chat widget is ready to begin receiving them. - Verified identity options
All of the options shown are optional. The snippet below displays the default values.
FrontChat('init', {
useDefaultLauncher: true, // optional
shouldShowWindowOnLaunch: false, // optional
shouldHideCloseButton: false, // optional
isMobileWebview: false, // optional
welcomeMessageAppearance: 'hidden', //optional
onInitCompleted: () => console.log('initialized') // optional
});
FrontChat('shutdown', options)
You can use shutdown
to remove the chat widget from your page after starting it. The chat widget will disappear from the page until init
is called again (or the page is reloaded). If the chat widget is reinitialized later, the previous conversation will be resumed.
FrontChat('shutdown');
Shutdown and clear session
When calling shutdown
, you can optionally clear the existing chat session. This will remove the Front Chat cookies associated with the chat session and clear any previously supplied identity information. Any initialization call after clearing the session will begin a fresh conversation.
FrontChat('shutdown', {clearSession: true});
FrontChat('show')
This will open the main FrontChat messenger panel.
FrontChat('show');
FrontChat('hide')
This will close the main FrontChat messenger panel. If useDefaultLancher
was set to false, the launcher will not appear.
FrontChat('hide');
FrontChat('onUnreadChange', handler)
This method allows you to register a function (the handler
) that will be called when the current number of unread messages changes. The handler
is expected to be a function that will receive an object like {unread_count: 1}
as its first parameter. The handler will always be called immediately to pass an initial value.
It will return an unbind
function that you can call to unregister the handler.
const unbind = FrontChat('onUnreadChange', handler);
FrontChat('onInboundMessageReceived', handler)
This method allows you to register a function (the handler) that will be called when an inbound message arrives at the chat widget. The handler is expected to be a function that has no parameters.
It will return an unbind
function that you can call to unregister the handler.
const unbind = FrontChat('onInboundMessageReceived', handler);
Accessing chat messages through the Core API
Like all communication channels in Front, messages sent and received through Front Chat can be accessed through the Core API . The Message object for Front Chat messages also includes a metadata.chat_visitor_url
property that denotes the URL that the chat visitor was on when they sent the message. Front Chat messages sent by Front users do not contain this property.
FrontChat('onWindowVisibilityChanged', handler)
This method allows you to register a function (the handler) that will be called when the visibility of the chat window changes. The handler is expected to be a function that will receive an object like {is_window_visible: 1}
as its first parameter. The handler will always be called immediately to pass an initial value.
It will return an unbind
function that you can call to unregister the handler.
const unbind = FrontChat('onWindowVisibilityChanged', handler);
Updated 11 days ago