{"id":17996,"date":"2017-08-02T16:08:46","date_gmt":"2017-08-02T16:08:46","guid":{"rendered":"http:\/\/developer.kore.ai\/v10-1\/?post_type=docs&#038;p=11696"},"modified":"2023-10-16T16:42:58","modified_gmt":"2023-10-16T15:42:58","slug":"botkit-sdk-tutorial-agent-transfer","status":"publish","type":"post","link":"https:\/\/developer.kore.ai\/v10-1\/docs\/bots\/sdks\/botkit-sdk-tutorial-agent-transfer\/","title":{"rendered":"BotKit SDK Tutorial &#8211; Agent Transfer"},"content":{"rendered":"<p><span style=\"font-weight: 400;\">This tutorial is an end-to-end walkthrough for setting up and running an instance of the Kore.ai BotKit SDK which is a collection of libraries that you can use for more control of the messages and webhook events for Kore.ai assistants for your web service. For this tutorial, you will use the sample assistant called<\/span><em><span style=\"font-weight: 400;\"> Airlines Airlines Travel Planning<\/span><\/em><span style=\"font-weight: 400;\"> that you can install as a new assistant, import a dialog task for agent transfer, generate authentication tokens, test the assistant using <\/span><em><span style=\"font-weight: 400;\">ngrok<\/span><\/em><span style=\"font-weight: 400;\"> as a test callback server, and access the agent transfer to a live agent using <\/span><em><span style=\"font-weight: 400;\">LiveChat<\/span><\/em><span style=\"font-weight: 400;\">.<\/span><\/p>\n<table style=\"height: 18px; width: 100%; border-collapse: collapse; background-color: #fffbea;\">\n<tbody>\n<tr style=\"height: 18px;\">\n<td style=\"width: 100%; height: 18px;\"><strong>Note<\/strong><span style=\"font-weight: 400;\">: This tutorial may require a newer version of BotSDK files. If the downloaded BotKit SDK files do not contain LiveChat.js and LiveChatAPI.js files, contact support.<\/span><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<div class=\"w-separator size_small with_line width_default thick_1 style_solid color_border align_center\"><div class=\"w-separator-h\"><\/div><\/div>\n<h2><span class=\"ez-toc-section\" id=\"Prerequisites\"><span style=\"font-weight: 400;\">Prerequisites<\/span><\/span><\/h2>\n<p><span style=\"font-weight: 400;\">To complete this tutorial, you will have to set up and configure the following prerequisites:<\/span><\/p>\n<ul>\n<li style=\"font-weight: 400;\"><strong>LiveChat account<\/strong><span style=\"font-weight: 400;\"> \u2013 Subscribe to or set up a free 30-day trial. You will need the license number from the <\/span><em><span style=\"font-weight: 400;\">LiveChat<\/span><\/em><span style=\"font-weight: 400;\"> account to configure the BotKit SDK settings for this tutorial.<\/span><\/li>\n<li style=\"font-weight: 400;\"><strong>Install and run ngrok<\/strong><span style=\"font-weight: 400;\"> as your test callback server. The test callback server application, <\/span><em><span style=\"font-weight: 400;\">ngrok<\/span><\/em><span style=\"font-weight: 400;\">, is used to simulate your callback server application.<\/span><\/li>\n<li style=\"font-weight: 400;\"><strong>Install <\/strong><strong><em>node.js<\/em><\/strong><strong> on your computer<\/strong><span style=\"font-weight: 400;\"> \u2013 The BotKit SDK requires <\/span><em><span style=\"font-weight: 400;\">node.js<\/span><\/em><span style=\"font-weight: 400;\"> (version 10 or above) to communicate between your server and the Kore.ai XO Platform.<\/span><\/li>\n<\/ul>\n<p><span style=\"font-weight: 400;\">To get your <\/span><em><span style=\"font-weight: 400;\">LiveChat<\/span><\/em><span style=\"font-weight: 400;\"> license code for your BotKit SDK configuration:\u00a0<\/span><\/p>\n<ol>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Log into your LiveChat account and click the <\/span><strong>Settings<\/strong> <span style=\"font-weight: 400;\"> icon on the left navigation bar.\u00a0<\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">You will be taken to the <\/span><em><span style=\"font-weight: 400;\">Website Channel Settings<\/span><\/em><span style=\"font-weight: 400;\"> page and you will find the <\/span><strong>License ID<\/strong><span style=\"font-weight: 400;\"> right underneath the area that lets you <\/span><em><span style=\"font-weight: 400;\">Install LiveChat Code Manually, as illustrated below.<br \/>\n<a ref=\"magnificPopup\" href=\"https:\/\/kore-wordpress.s3.us-east-2.amazonaws.com\/developer.kore.ai\/v10-1\/wp-content\/uploads\/sites\/35\/20221005054904\/get-livechat-licenceid.png\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-48113\" src=\"https:\/\/kore-wordpress.s3.us-east-2.amazonaws.com\/developer.kore.ai\/v10-1\/wp-content\/uploads\/sites\/35\/20221005054904\/get-livechat-licenceid.png\" alt=\"\" width=\"662\" height=\"291\" srcset=\"https:\/\/kore-wordpress.s3.us-east-2.amazonaws.com\/developer.kore.ai\/v10-1\/wp-content\/uploads\/sites\/35\/20221005054904\/get-livechat-licenceid.png 1964w, https:\/\/kore-wordpress.s3.us-east-2.amazonaws.com\/developer.kore.ai\/v10-1\/wp-content\/uploads\/sites\/35\/20221005054904\/get-livechat-licenceid-300x132.png 300w, https:\/\/kore-wordpress.s3.us-east-2.amazonaws.com\/developer.kore.ai\/v10-1\/wp-content\/uploads\/sites\/35\/20221005054904\/get-livechat-licenceid-1024x450.png 1024w\" sizes=\"auto, (max-width: 662px) 100vw, 662px\" \/><\/a><br \/>\n<\/span><\/em><\/li>\n<\/ol>\n<table style=\"height: 18px; width: 100%; border-collapse: collapse; background-color: #fffbea;\">\n<tbody>\n<tr style=\"height: 18px;\">\n<td style=\"width: 100%; height: 18px;\"><strong>Note<\/strong><span style=\"font-weight: 400;\">: Make sure <strong>url-template<\/strong> and <strong>node-schedule<\/strong> modules (and any other modules as referenced in js file related to LiveChat) are installed on your computer.<\/span><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<h3><\/h3>\n<h3><span class=\"ez-toc-section\" id=\"Installing_and_running_ngrok\"><span style=\"font-weight: 400;\">Installing and running <\/span><em><span style=\"font-weight: 400;\">ngrok<\/span><\/em><\/span><\/h3>\n<p><span style=\"font-weight: 400;\">To download the test callback server application, click <\/span><a href=\"https:\/\/ngrok.com\/download\"><span style=\"font-weight: 400;\">https:\/\/ngrok.com\/download<\/span><\/a><span style=\"font-weight: 400;\">, and then download and install the <\/span><em><span style=\"font-weight: 400;\">ngrok<\/span><\/em><span style=\"font-weight: 400;\"> file for your operating system.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">In a <\/span><strong>Terminal<\/strong><span style=\"font-weight: 400;\"> Window, start <\/span><em><span style=\"font-weight: 400;\">ngrok<\/span><\/em><span style=\"font-weight: 400;\"> to monitor port <\/span><span style=\"font-weight: 400;\">8003<\/span><span style=\"font-weight: 400;\"> using the following command:<\/span><\/p>\n<p><code><span style=\"font-weight: 400;\">ngrok http 8003<\/span><\/code><\/p>\n<p><span style=\"font-weight: 400;\"><a ref=\"magnificPopup\" href=\"https:\/\/kore-wordpress.s3.us-east-2.amazonaws.com\/developer.kore.ai\/v10-1\/wp-content\/uploads\/sites\/35\/20221005054909\/DIYBotKitSDKNgrok-1.png\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-48116\" src=\"https:\/\/kore-wordpress.s3.us-east-2.amazonaws.com\/developer.kore.ai\/v10-1\/wp-content\/uploads\/sites\/35\/20221005054909\/DIYBotKitSDKNgrok-1.png\" alt=\"\" width=\"560\" height=\"177\" srcset=\"https:\/\/kore-wordpress.s3.us-east-2.amazonaws.com\/developer.kore.ai\/v10-1\/wp-content\/uploads\/sites\/35\/20221005054909\/DIYBotKitSDKNgrok-1.png 1119w, https:\/\/kore-wordpress.s3.us-east-2.amazonaws.com\/developer.kore.ai\/v10-1\/wp-content\/uploads\/sites\/35\/20221005054909\/DIYBotKitSDKNgrok-1-300x95.png 300w, https:\/\/kore-wordpress.s3.us-east-2.amazonaws.com\/developer.kore.ai\/v10-1\/wp-content\/uploads\/sites\/35\/20221005054909\/DIYBotKitSDKNgrok-1-1024x324.png 1024w\" sizes=\"auto, (max-width: 560px) 100vw, 560px\" \/><\/a><\/span><\/p>\n<p><span style=\"font-weight: 400;\">Copy the https <\/span><strong>Forwarding URL<\/strong><span style=\"font-weight: 400;\"> as shown in the previous illustration, for example, <\/span><span style=\"font-weight: 400;\">https:\/\/1b47f1d2.ngrok.io<\/span><span style=\"font-weight: 400;\">. Leave the terminal window open and <\/span><em><span style=\"font-weight: 400;\">ngrok<\/span><\/em><span style=\"font-weight: 400;\"> running.<\/span><\/p>\n<h3><span class=\"ez-toc-section\" id=\"Installing_nodejs\"><span style=\"font-weight: 400;\">Installing node.js<\/span><\/span><\/h3>\n<p><span style=\"font-weight: 400;\">The BotKit SDK requires <\/span><em><span style=\"font-weight: 400;\">node.js<\/span><\/em><span style=\"font-weight: 400;\"> (version 10 or above) to run on the same server where the SDK is installed. Go to <\/span><a href=\"https:\/\/nodejs.org\/en\/download\/\"><span style=\"font-weight: 400;\">https:\/\/nodejs.org\/en\/download\/<\/span><\/a><span style=\"font-weight: 400;\">, and then select your OS as a <\/span><span style=\"font-weight: 400;\">.pkg<\/span><span style=\"font-weight: 400;\"> file type for Mac and <\/span><span style=\"font-weight: 400;\">.msi<\/span><span style=\"font-weight: 400;\"> file type for Windows.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">In a <\/span><strong>Terminal<\/strong><span style=\"font-weight: 400;\"> window, run the <\/span><code><span style=\"font-weight: 400;\">node -v<\/span><\/code><span style=\"font-weight: 400;\"> command to verify installation and version, for example, <\/span><code><span style=\"font-weight: 400;\">v6.10.2 <\/span><\/code><span style=\"font-weight: 400;\">as shown in the following illustration.<\/span><\/p>\n<p><span style=\"font-weight: 400;\"><a ref=\"magnificPopup\" href=\"https:\/\/kore-wordpress.s3.us-east-2.amazonaws.com\/developer.kore.ai\/v10-1\/wp-content\/uploads\/sites\/35\/20221005054856\/DIYBotKITSDKTutorialNodeJS-1.png\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-48110\" src=\"https:\/\/kore-wordpress.s3.us-east-2.amazonaws.com\/developer.kore.ai\/v10-1\/wp-content\/uploads\/sites\/35\/20221005054856\/DIYBotKITSDKTutorialNodeJS-1.png\" alt=\"\" width=\"551\" height=\"120\" srcset=\"https:\/\/kore-wordpress.s3.us-east-2.amazonaws.com\/developer.kore.ai\/v10-1\/wp-content\/uploads\/sites\/35\/20221005054856\/DIYBotKITSDKTutorialNodeJS-1.png 436w, https:\/\/kore-wordpress.s3.us-east-2.amazonaws.com\/developer.kore.ai\/v10-1\/wp-content\/uploads\/sites\/35\/20221005054856\/DIYBotKITSDKTutorialNodeJS-1-300x65.png 300w\" sizes=\"auto, (max-width: 551px) 100vw, 551px\" \/><\/a><\/span><\/p>\n<div class=\"w-separator size_small with_line width_default thick_1 style_solid color_border align_center\"><div class=\"w-separator-h\"><\/div><\/div>\n<h2><span class=\"ez-toc-section\" id=\"Installing_and_Configuring_Your_Assistant\"><span style=\"font-weight: 400;\">Installing and Configuring Your Assistant<\/span><\/span><\/h2>\n<p><span style=\"font-weight: 400;\">With the prerequisites installed and running, you are ready to install the <\/span><em><span style=\"font-weight: 400;\">Airlines Travel Planning<\/span><\/em><span style=\"font-weight: 400;\"> assistant and then import the <\/span><em><span style=\"font-weight: 400;\">Agent Transfer<\/span><\/em><span style=\"font-weight: 400;\"> dialog task into it. In this section, you will:<\/span><\/p>\n<ol>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Install the <\/span><em><span style=\"font-weight: 400;\">Travel Planning <\/span><\/em><span style=\"font-weight: 400;\">assistant\u00a0<\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Create a Dialog Task with an Agent Transfer node<\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Create an App Registration<\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Generate Security Credentials<\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Install and Configure the BotKit SDK \u2013 config.json, LiveChat.js, and LiveChatAPI.js files<\/span><\/li>\n<\/ol>\n<h3><span class=\"ez-toc-section\" id=\"Installing_the_Airlines_Travel_Planning_Assistant\"><span style=\"font-weight: 400;\">Installing the Airlines Travel Planning Assistant<\/span><\/span><\/h3>\n<p><span style=\"font-weight: 400;\">Kore.ai provides ready to use sample assistants that you can install into your instance of XO Platform. For this tutorial, you will need to install the <\/span><em><span style=\"font-weight: 400;\">Airlines Travel Planning<\/span><\/em><span style=\"font-weight: 400;\"> assistant.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">To install the Airlines Travel Planning assistant<\/span><\/p>\n<ol>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Log on to XO Platform, and then click <\/span><strong>New Bot &gt; Start from the Store<\/strong><span style=\"font-weight: 400;\">.<\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Point to <\/span><strong>Airlines Airlines Travel Planning<\/strong><span style=\"font-weight: 400;\">, and then click <\/span><strong>Install<\/strong><span style=\"font-weight: 400;\">. The Airlines <\/span><em><span style=\"font-weight: 400;\">Airlines Travel Planning_KORE NAME_Instance# The installed successful<\/span><\/em><span style=\"font-weight: 400;\"> message is displayed and the sample assistant is added to the left-hand navigation menu.<\/span><\/li>\n<\/ol>\n<p><span style=\"font-weight: 400;\">Once the sample assistant is installed, create an <\/span><strong><em>Agent Transfer<\/em><\/strong><span style=\"font-weight: 400;\"> dialog task. Learn more about the<\/span><span style=\"font-weight: 400;\">\u00a0<a href=\"https:\/\/developer.kore.ai\/v10-1\/docs\/bots\/chatbot-overview\/using-the-dialog-builder-tool\/\" target=\"_blank\" rel=\"noopener noreferrer\">Dialog Builder<\/a><\/span><span style=\"font-weight: 400;\"> and with the <\/span><a href=\"https:\/\/developer.kore.ai\/v10-1\/docs\/bots\/bot-builder-tool\/dialog-task\/working-with-the-agent-transfer-node\/\" target=\"_blank\" rel=\"noopener noreferrer\"><span style=\"font-weight: 400;\">Agent Transfer node<\/span><\/a><span style=\"font-weight: 400;\">.<\/span><\/p>\n<h3><span class=\"ez-toc-section\" id=\"Registering_Your_App_and_Generating_Client_Credentials\"><span style=\"font-weight: 400;\">Registering Your App and Generating Client Credentials<\/span><\/span><\/h3>\n<p><span style=\"font-weight: 400;\">To register your BotKit SDK with the Kore.ai XO Platform, you will need to create an app registration, and then generate security credentials used to securely communicate between the SDK installed on your server platform and the Kore.ai XO Platform.<\/span><\/p>\n<p><strong>Creating an App Registration<\/strong><\/p>\n<ol>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">In the XO Platform, go to <\/span><strong>Build &gt; Integrations &gt; BotKit<\/strong>.<br \/>\n<strong>Note:<\/strong> RS256 and RS512 JWT signing algorithms are not supported for Custom BotKit or Botkit.<\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Click the <strong>Add<\/strong> button next to the <\/span><strong>App name <\/strong><span style=\"font-weight: 400;\">drop-down list<\/span><span style=\"font-weight: 400;\">.<\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Enter a name for the app and then click Next.<\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">The Client ID and Client Secret details appear. Click <\/span><strong>Done<\/strong><span style=\"font-weight: 400;\">.<\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">In the <\/span><strong>Callback URL<\/strong><span style=\"font-weight: 400;\"> field, enter the URL for your application that you copied from the <\/span><strong>Forwarding URL<\/strong><span style=\"font-weight: 400;\"> from the <\/span><em><span style=\"font-weight: 400;\">ngrok<\/span><\/em><span style=\"font-weight: 400;\"> application that you installed and ran as part of the prerequisites, for example,\u00a0 <\/span><span style=\"font-weight: 400;\">https:\/\/1bXXXXd2.ngrok.io<\/span><span style=\"font-weight: 400;\">.<\/span><span style=\"font-weight: 400;\"><br \/>\n<\/span><strong><em>Note<\/em><\/strong><em><span style=\"font-weight: 400;\">: Each running instance of ngrok will generate a session unique URL. You need to update the Callback URL field if you stop and restart ngrok.<\/span><\/em><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">In the <\/span><strong>Events<\/strong><span style=\"font-weight: 400;\"> section, select:<\/span>\n<ol>\n<li style=\"font-weight: 400;\"><strong>OnMessage<\/strong><span style=\"font-weight: 400;\"> \u2013 An event is triggered when a message from a user is received.<\/span><\/li>\n<li style=\"font-weight: 400;\"><strong>OnAgentTransferNode<\/strong><span style=\"font-weight: 400;\"> \u2013 An event is triggered when an Agent Transfer node is encountered in the dialog task flow.<\/span><\/li>\n<\/ol>\n<\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Click <\/span><strong>Create Credentials. <\/strong><span style=\"font-weight: 400;\">The new app registration along with client credentials are displayed in the <\/span><strong>SDK Configuration<\/strong><span style=\"font-weight: 400;\"> section.<\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Click <\/span><strong>Save<\/strong><span style=\"font-weight: 400;\">. The <\/span><em><span style=\"font-weight: 400;\">Successfully subscribed<\/span><\/em><span style=\"font-weight: 400;\"> message is displayed.<\/span><\/li>\n<\/ol>\n<p><span style=\"font-weight: 400;\">To configure the BotKit SDK settings, you will need to:<\/span><\/p>\n<ul>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Copy the <\/span><strong>Client ID<\/strong><span style=\"font-weight: 400;\">, for example, <\/span><span style=\"font-weight: 400;\">cs-6e5eb411-XXXX-XXXX-9ba2-ccc748d4f719<\/span><span style=\"font-weight: 400;\">.<\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">View, and then copy the <\/span><strong>Client Secret<\/strong><span style=\"font-weight: 400;\">, for example, <\/span><span style=\"font-weight: 400;\">dTTmuTOgs8SOXXXXXXXXouE0EPy28fXojOJWedOEF6s=<\/span><span style=\"font-weight: 400;\">.<\/span><\/li>\n<\/ul>\n<div class=\"w-separator size_small with_line width_default thick_1 style_solid color_border align_center\"><div class=\"w-separator-h\"><\/div><\/div>\n<h2><span class=\"ez-toc-section\" id=\"Publishing_the_Assistant\"><span style=\"font-weight: 400;\">Publishing the Assistant<\/span><\/span><\/h2>\n<p><span style=\"font-weight: 400;\">A developer can use any installed assistant immediately for testing as it is available to the owner on save. If you only want to run and test this assistant for this tutorial, you can skip to the next section, <\/span><em><span style=\"font-weight: 400;\">Installing and Configuring the BotKit SDK<\/span><\/em><span style=\"font-weight: 400;\">.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">To enable the assistant for other users, you must publish it so the Admin can approve and deploy the assistant for other users. For more information, see <\/span><a href=\"https:\/\/developer.kore.ai\/v10-1\/docs\/bots\/publish\/publishing-bot\/#Publishing_Tasks\"><span style=\"font-weight: 400;\">Publishing an Assistant<\/span><\/a><span style=\"font-weight: 400;\">.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">After you publish an assistant in XO Platform, an Admin must complete one of the following deployments tasks in the Admin Console depending on whether your assistant\u2019s <\/span><strong>Target Audience<\/strong><span style=\"font-weight: 400;\"> is set to <\/span><strong>Enterprise Users <\/strong><span style=\"font-weight: 400;\">or the <\/span><strong>General Public<\/strong><span style=\"font-weight: 400;\">.<\/span><\/p>\n<ul>\n<li style=\"font-weight: 400;\"><strong>For Enterprise Users:<\/strong>\n<ol>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">In the Admin Console, in the <\/span><strong>Bots Management<\/strong><span style=\"font-weight: 400;\"> module, on the <\/span><strong>Enterprise Bots<\/strong><span style=\"font-weight: 400;\"> page, click the <\/span><strong>Ellipses<\/strong><span style=\"font-weight: 400;\"> icon for the <\/span><em><span style=\"font-weight: 400;\">Agent Transfer<\/span><\/em><span style=\"font-weight: 400;\"> assistant that you want to deploy, and then click <\/span><strong>Manage bot tasks<\/strong><span style=\"font-weight: 400;\">. The <\/span><strong>Manage Bot Tasks<\/strong><span style=\"font-weight: 400;\"> dialog is displayed.<\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Expand the <\/span><em><span style=\"font-weight: 400;\">Bot Tasks<\/span><\/em><span style=\"font-weight: 400;\"> field to view the available and deployed tasks.<\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Select all tasks of the assistant and then click <\/span><strong>Confirm<\/strong><span style=\"font-weight: 400;\">.<\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">In the <\/span><strong>Manage bots tasks<\/strong><span style=\"font-weight: 400;\"> dialog, click <\/span><strong>Confirm<\/strong><span style=\"font-weight: 400;\">. The <\/span><em><span style=\"font-weight: 400;\">Bot status changed successfully<\/span><\/em><span style=\"font-weight: 400;\"> message is displayed.<\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">On the <\/span><strong>Enterprise Bots<\/strong><span style=\"font-weight: 400;\"> page, click the <\/span><strong>Ellipses<\/strong><span style=\"font-weight: 400;\"> icon for the <\/span><em><span style=\"font-weight: 400;\">Agent Transfer<\/span><\/em><span style=\"font-weight: 400;\"> bot that you want to assign enterprise users to, and then click <\/span><strong>Bot &amp; task assignments<\/strong><span style=\"font-weight: 400;\">. The <\/span><strong>Bot &amp; task assignments<\/strong><span style=\"font-weight: 400;\"> dialog is displayed.<\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Assign the assistant to the selected users in the enterprise.<\/span><\/li>\n<\/ol>\n<\/li>\n<\/ul>\n<ul>\n<li style=\"font-weight: 400;\"><strong>For General Public Users:<\/strong>\n<ol>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">In the Admin Console, in the <\/span><strong>Bots Management<\/strong><span style=\"font-weight: 400;\"> module, on the <\/span><strong>Consumer Bots<\/strong><span style=\"font-weight: 400;\"> page, click the <\/span><strong>Ellipses<\/strong><span style=\"font-weight: 400;\"> icon for the <\/span><em><span style=\"font-weight: 400;\">Agent Transfer<\/span><\/em><span style=\"font-weight: 400;\"> assistant that you want to deploy, and then click <\/span><strong>Manage bot tasks<\/strong><span style=\"font-weight: 400;\">. The <\/span><strong>Manage Bot Tasks<\/strong><span style=\"font-weight: 400;\"> dialog is displayed.<\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Expand the <\/span><em><span style=\"font-weight: 400;\">Bot Tasks<\/span><\/em><span style=\"font-weight: 400;\"> field to view the available and deployed tasks.<\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Select all tasks of the bot and then click <\/span><strong>Confirm<\/strong><span style=\"font-weight: 400;\">. The <\/span><em><span style=\"font-weight: 400;\">Bot status changed successfully<\/span><\/em><span style=\"font-weight: 400;\"> message is displayed.<\/span><\/li>\n<\/ol>\n<\/li>\n<\/ul>\n<h3><span class=\"ez-toc-section\" id=\"Installing_and_Configuring_the_BotKit_SDK\"><span style=\"font-weight: 400;\">Installing and Configuring the BotKit SDK<\/span><\/span><\/h3>\n<p><span style=\"font-weight: 400;\">You need to download and then uncompress the Kore.ai BotKit SDK from <\/span><a href=\"https:\/\/github.com\/Koredotcom\/BotKit\"><span style=\"font-weight: 400;\">https:\/\/github.com\/Koredotcom\/BotKit<\/span><\/a><span style=\"font-weight: 400;\">. Be sure to download the latest version that contains the <\/span><a href=\"https:\/\/github.com\/Koredotcom\/BotKit\/blob\/master\/LiveChat.js\"><span style=\"font-weight: 400;\">LiveChat.js<\/span> <\/a><span style=\"font-weight: 400;\">files.<\/span><\/p>\n<table style=\"height: 18px; width: 100%; border-collapse: collapse; background-color: #fffbea;\">\n<tbody>\n<tr style=\"height: 18px;\">\n<td style=\"width: 100%; height: 18px;\"><strong><em>Note<span style=\"font-weight: 400;\">: This tutorial may require a newer version of BotSDK files. If the downloaded BotKit SDK files do not contain <\/span><a href=\"https:\/\/github.com\/Koredotcom\/BotKit\/blob\/master\/LiveChat.js\"><span style=\"font-weight: 400;\">LiveChat.js<\/span><\/a><span style=\"font-weight: 400;\"> and <\/span><a href=\"https:\/\/github.com\/Koredotcom\/BotKit\/blob\/master\/LiveChatAPI.js\"><span style=\"font-weight: 400;\">LiveChatAPI.js<\/span><\/a><span style=\"font-weight: 400;\"> files, contact Kore.ai Support.<\/span><\/em><\/strong><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<p><strong>Edit <\/strong><strong><em>config.json<\/em><\/strong><\/p>\n<p><span style=\"font-weight: 400;\">In your BotKit SDK folder, you will need to edit the <\/span><span style=\"font-weight: 400;\">config.json<\/span><span style=\"font-weight: 400;\"> file that contains the connection information to your callback server. For this tutorial, you are using <\/span><em><span style=\"font-weight: 400;\">ngrok<\/span><\/em><span style=\"font-weight: 400;\">, along with the security credentials generated when you created the app registration for the <\/span><em><span style=\"font-weight: 400;\">Airlines Travel Planning<\/span><\/em><span style=\"font-weight: 400;\"> assistant, and adding a new line to <\/span><span style=\"font-weight: 400;\">config.json<\/span><span style=\"font-weight: 400;\"> file that contains the license key for your <\/span><em><span style=\"font-weight: 400;\">LiveChat<\/span><\/em><span style=\"font-weight: 400;\"> agent application.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Modify the default <\/span><span style=\"font-weight: 400;\">config.json<\/span><span style=\"font-weight: 400;\"> file for the following parameters as follows:<\/span><\/p>\n<ul>\n<li style=\"font-weight: 400;\"><code><span style=\"font-weight: 400;\">url<\/span><\/code><span style=\"font-weight: 400;\"> \u2013 Add this parameter with the <\/span><strong>Forwarding URL<\/strong><span style=\"font-weight: 400;\"> from <\/span><em><span style=\"font-weight: 400;\">ngrok<\/span><\/em><\/li>\n<li style=\"font-weight: 400;\"><code><span style=\"font-weight: 400;\">apikey<\/span><\/code><span style=\"font-weight: 400;\"> \u2013 Update parameter using <\/span><strong>Client Secret<\/strong><\/li>\n<li style=\"font-weight: 400;\"><code><span style=\"font-weight: 400;\">appId<\/span><\/code><span style=\"font-weight: 400;\"> \u2013 Update parameter using <\/span><strong>Client ID<\/strong><\/li>\n<li style=\"font-weight: 400;\"><code><span style=\"font-weight: 400;\">liveagentlicense<\/span><\/code><span style=\"font-weight: 400;\"> \u2013 Add this parameter with license key from LiveChat <\/span><strong>Chat URL<\/strong><span style=\"font-weight: 400;\"> as shown in the following example.<\/span><\/li>\n<\/ul>\n<pre>{\r\n\"server\": {\r\n\"port\": 8003\r\n},\r\n\"app\": {\r\n\"apiPrefix\" : \"\",\r\n\"url\": \"&lt; ngrok Forwarding URL &gt;\"\r\n},\r\n\"credentials\": {\r\n\"apikey\": \"&lt; Client Secret from XO Platform &gt;\",\r\n\"appId\": \"&lt; Client ID from XO Platform &gt;\"\r\n},\r\n\"redis\": {\r\n\"options\": {\r\n\"host\": \"localhost\",\r\n\"port\": 6379\r\n},\r\n\"available\": false\r\n},\r\n\"examples\" : {\r\n\"mockServicesHost\" : \"http:\/\/localhost:8004\"\r\n},\r\n\"liveagentlicense\": \"&lt; LiveChat License Key &gt;\"\r\n}<\/pre>\n<p><span style=\"font-weight: 400;\">The following code is an example of a fully defined sample <\/span><span style=\"font-weight: 400;\">config.json<\/span><span style=\"font-weight: 400;\"> file:<\/span><\/p>\n<pre>{\r\n\"server\": {\r\n\"port\": 8003\r\n},\r\n\"app\": {\r\n\"apiPrefix\" : \"\",\r\n\"url\": \"https:\/\/1b47f1d2.ngrok.io\"\r\n},\r\n\"credentials\": {\r\n\"apikey\": \"dTTmuTOgs8SOCwXXXXXXXXE0EPy28fXojOJWedOEF6s=\",\r\n\"appId\": \"cs-6e5eb411-XXXX-XXXX-9ba2-ccc748d4f719\"\r\n},\r\n\"redis\": {\r\n\"options\": {\r\n\"host\": \"localhost\",\r\n\"port\": 6379\r\n},\r\n\"available\": false\r\n},\r\n\"examples\" : {\r\n\"mockServicesHost\" : \"http:\/\/localhost:8004\"\r\n},\r\n\"liveagentlicense\": \"89XXX15\"\r\n}<\/pre>\n<h4><span style=\"font-weight: 400;\">LiveChat.js and LiveChatAPI.js<\/span><\/h4>\n<p><span style=\"font-weight: 400;\">The<\/span><a href=\"https:\/\/github.com\/Koredotcom\/BotKit\/blob\/master\/LiveChat.js\"> <span style=\"font-weight: 400;\">LiveChat.js<\/span><\/a><span style=\"font-weight: 400;\"> and <\/span><a href=\"https:\/\/github.com\/Koredotcom\/BotKit\/blob\/master\/LiveChatAPI.js\"><span style=\"font-weight: 400;\">LiveChatAPI.js<\/span><\/a><span style=\"font-weight: 400;\"> files in the BotKit SDK contain the JavaScript that controls the seamless transfer from the dialog task in the assistant to an agent application. For this tutorial, you will configure the dialog transfer using <\/span><em><span style=\"font-weight: 400;\">LiveChat<\/span><\/em><span style=\"font-weight: 400;\"> with the following information:<\/span><\/p>\n<p><span style=\"font-weight: 400;\">In XO Platform, select the <\/span><em><span style=\"font-weight: 400;\">Airlines Travel Planning<\/span><\/em><span style=\"font-weight: 400;\"> assistant, and then on the <\/span><strong>Configurations <\/strong><span style=\"font-weight: 400;\">tab, click the <\/span><strong>Expand<\/strong><span style=\"font-weight: 400;\"> icon for the <\/span><strong>General Settings<\/strong><span style=\"font-weight: 400;\"> section. The <\/span><strong>General Settings <\/strong><span style=\"font-weight: 400;\">section is displayed. Copy the:<\/span><\/p>\n<ul>\n<li style=\"font-weight: 400;\"><strong>Bot Name<\/strong><span style=\"font-weight: 400;\"> \u2013 The name of the assistant on the XO Platform, for example, <\/span><em><span style=\"font-weight: 400;\">Airlines Travel Planning_KORE ADMIN_10<\/span><\/em><span style=\"font-weight: 400;\">.<\/span><\/li>\n<li style=\"font-weight: 400;\"><strong>Bot ID<\/strong><span style=\"font-weight: 400;\"> \u2013 The XO Platform system has a unique ID for the assistant, for example, <\/span><em><span style=\"font-weight: 400;\">st-26cfae3a-XXXX-XXXX-991a-376b7fe579d5<\/span><\/em><span style=\"font-weight: 400;\">.<\/span><\/li>\n<\/ul>\n<p><span style=\"font-weight: 400;\">In both the <\/span><span style=\"font-weight: 400;\">LiveChat.js<\/span><span style=\"font-weight: 400;\"> and <\/span><span style=\"font-weight: 400;\">LiveChatAPI.js<\/span><span style=\"font-weight: 400;\">, update and save the following case-sensitive variables with the settings from your assistant\u2019s instance:<\/span><\/p>\n<p><span style=\"font-weight: 400;\"><code>var botId<\/code> = &#8220;&lt; <\/span><strong><em>Bot ID<\/em><\/strong><span style=\"font-weight: 400;\"> &gt;&#8221;;<\/span><\/p>\n<p><span style=\"font-weight: 400;\"><code>var botName<\/code> = &#8220;&lt; <\/span><strong><em>Bot Name<\/em><\/strong><em><span style=\"font-weight: 400;\"> &gt;<\/span><\/em><span style=\"font-weight: 400;\">&#8220;;<\/span><\/p>\n<p><span style=\"font-weight: 400;\">For example:<\/span><\/p>\n<p><code><span style=\"font-weight: 400;\">var botId = \"<\/span><em><span style=\"font-weight: 400;\">st-26cfae3a-XXXX-XXXX-991a-376b7fe579d5<\/span><\/em><span style=\"font-weight: 400;\">\";<br \/>\n<\/span><span style=\"font-weight: 400;\">var botName = \"<\/span><em><span style=\"font-weight: 400;\">Airlines Travel Planning_KORE ADMIN_10<\/span><\/em><span style=\"font-weight: 400;\">\";<\/span><\/code><\/p>\n<div class=\"w-separator size_small with_line width_default thick_1 style_solid color_border align_center\"><div class=\"w-separator-h\"><\/div><\/div>\n<h2><span class=\"ez-toc-section\" id=\"Starting_the_BotKit_SDK_Application\"><span style=\"font-weight: 400;\">Starting the BotKit SDK Application<\/span><\/span><\/h2>\n<p><span style=\"font-weight: 400;\">To start using the <\/span><em><span style=\"font-weight: 400;\">Airlines Travel Planning<\/span><\/em><span style=\"font-weight: 400;\"> assistant with Agent Transfer using the BotKit SDK, <\/span><em><span style=\"font-weight: 400;\">node.js<\/span><\/em><span style=\"font-weight: 400;\"> must be installed and <\/span><em><span style=\"font-weight: 400;\">ngrok<\/span><\/em><span style=\"font-weight: 400;\"> running listening on port <\/span><span style=\"font-weight: 400;\">8003<\/span><span style=\"font-weight: 400;\">.<\/span><\/p>\n<p><strong>To start BotKit SDK<\/strong><\/p>\n<p><span style=\"font-weight: 400;\">In a <\/span><strong>Terminal<\/strong><span style=\"font-weight: 400;\"> window, navigate to your BotKit SDK folder, and then enter the following command:<\/span><\/p>\n<p><code><span style=\"font-weight: 400;\">node app.js<\/span><\/code><\/p>\n<p><span style=\"font-weight: 400;\">When node.js is running, you should get the following response:<\/span><\/p>\n<p><code><span style=\"font-weight: 400;\">app listening at <a href=\"http:\/\/:::8003\">http:\/\/:::8003<\/a><\/span><\/code><\/p>\n<div class=\"w-separator size_small with_line width_default thick_1 style_solid color_border align_center\"><div class=\"w-separator-h\"><\/div><\/div>\n<h2><span class=\"ez-toc-section\" id=\"Testing_the_BotKit_SDK_Bot\"><span style=\"font-weight: 400;\">Testing the BotKit SDK Bot<\/span><\/span><\/h2>\n<p><span style=\"font-weight: 400;\">To test your assistant, you need the following:<\/span><\/p>\n<ul>\n<li style=\"font-weight: 400;\"><em><span style=\"font-weight: 400;\">ngrok<\/span><\/em><span style=\"font-weight: 400;\"> running \u2013 Command = <\/span><code><span style=\"font-weight: 400;\">ngrok http 8003<\/span><\/code><\/li>\n<li style=\"font-weight: 400;\"><em><span style=\"font-weight: 400;\">node.js<\/span><\/em><span style=\"font-weight: 400;\"> running \u2013 Command = <\/span><code><span style=\"font-weight: 400;\">node app.js<\/span><\/code><\/li>\n<li style=\"font-weight: 400;\"><em><span style=\"font-weight: 400;\">LiveChat<\/span><\/em><span style=\"font-weight: 400;\"> \u2013 Logged in and web <\/span><strong>Chat<\/strong><span style=\"font-weight: 400;\"> page open<\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">XO Platform \u2013 Start <\/span><em><span style=\"font-weight: 400;\">Talk to the Bot<\/span><\/em><span style=\"font-weight: 400;\"> by clicking the following icon on the bottom right corner of any XO Platform page:<\/span><\/li>\n<\/ul>\n<p><span style=\"font-weight: 400;\">After the Agent Transfer dialog is started, messages are exchanged between <\/span><em><span style=\"font-weight: 400;\">LiveChat<\/span><\/em><span style=\"font-weight: 400;\"> and the BotKit SDK.<\/span><\/p>\n<div class=\"w-separator size_small with_line width_default thick_1 style_solid color_border align_center\"><div class=\"w-separator-h\"><\/div><\/div>\n<h2><span class=\"ez-toc-section\" id=\"Next_Steps\"><span style=\"font-weight: 400;\">Next Steps<\/span><\/span><\/h2>\n<p><span style=\"font-weight: 400;\">To use the Kore.ai assistant in your application, you would need to configure the BotKit SDK and register your application with <\/span><strong>CallBack URL<\/strong><span style=\"font-weight: 400;\"> to point to your company application server instead of <\/span><em><span style=\"font-weight: 400;\">ngrok<\/span><\/em><span style=\"font-weight: 400;\">. And of course, to share the assistant with other users, the Enterprise Admin for your company would need to approve the assistant, and then deploy it to those users after you publish.<\/span><\/p>\n<div class=\"w-separator size_small with_line width_default thick_1 style_solid color_border align_center\"><div class=\"w-separator-h\"><\/div><\/div>\n","protected":false},"excerpt":{"rendered":"<p>This tutorial is an end-to-end walkthrough for setting up and running an instance of the Kore.ai BotKit SDK which is a collection of libraries that you can use for more control of the messages and webhook events for Kore.ai assistants for your web service. For this tutorial, you will use the sample assistant called Airlines&#8230;<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[36],"tags":[],"class_list":["post-17996","post","type-post","status-publish","format-standard","hentry","category-sdks"],"_links":{"self":[{"href":"https:\/\/developer.kore.ai\/v10-1\/wp-json\/wp\/v2\/posts\/17996","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/developer.kore.ai\/v10-1\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/developer.kore.ai\/v10-1\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/developer.kore.ai\/v10-1\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/developer.kore.ai\/v10-1\/wp-json\/wp\/v2\/comments?post=17996"}],"version-history":[{"count":14,"href":"https:\/\/developer.kore.ai\/v10-1\/wp-json\/wp\/v2\/posts\/17996\/revisions"}],"predecessor-version":[{"id":59890,"href":"https:\/\/developer.kore.ai\/v10-1\/wp-json\/wp\/v2\/posts\/17996\/revisions\/59890"}],"wp:attachment":[{"href":"https:\/\/developer.kore.ai\/v10-1\/wp-json\/wp\/v2\/media?parent=17996"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/developer.kore.ai\/v10-1\/wp-json\/wp\/v2\/categories?post=17996"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/developer.kore.ai\/v10-1\/wp-json\/wp\/v2\/tags?post=17996"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}