Facing issue while integrating bot with web/mobile client channel


(Ankit Saini) #1

I am following this tutorial to integrate a bot with sdkApp provided in the same tutorial, but I am getting the following error
image

image

And after updating path (19th point), chat window disappears.

Please help me with editing the index.html file inside “/SDKApp/sdk/UI” folder.


Could not host the websdk in enterprise environment
(swathi vadlamani) #2

Hi @ankitsaini345 please try the steps given below and check once again.

  1. To download and install node.js on your computer, go to https://nodejs.org/en/download/, and then select your OS as .pkg for Mac, and .msi for Windows. In a Terminal window, run the node -v command to verify installation and version, for example, v6.10.2

  2. Make sure you have all packages form node installed on your system. Use the following commands for installing the required packages after installing node.js
    npm install express
    npm install body-parser
    npm install jwt-simple

  3. For hosting the bot on your web application, you should have a web app running along with a JWT service. So please open generateJWT.js file and define the clientSecret value as shown below and save:
    var clientSecret = req.body.clientSecret;

  4. Download your web applications web-sdk folder, unzip it, go to UI folder and EDIT index.html file and enter the following details and save. Sample attached.

“clientSecret”: “{client secret}”
$.ajax({
url: “http://localhost:3000/api/ /users/getJWT”, //this is sample url of my localhost. This should include the url where you are hosting the bot.
botOptions.userIdentity = ‘ ‘;// Provide users email id here
botOptions.clientId= "{client id} "; // secure client-id
_botOptions.botInfo= {name:"{bot name}","id":"{bot id"}; // bot name is case sensitive

You find all these values in Apps and Agents - Web/Mobile SDK in your bot.
Once you save the index.html, run it .

Keep me posted.


(Ankit Saini) #4

Hi Swathi,

I did all the steps but still getting the same error.

Error: Failed to lookup view “error” in views directory “C:\Users\sainankc\Downloads\Kore.ai\SDKApp\sdk”
at Function.render (C:\Users\sainankc\Downloads\Kore.ai\SDKApp\node_modules\express\lib\application.js:579:17)
at ServerResponse.render (C:\Users\sainankc\Downloads\Kore.ai\SDKApp\node_modules\express\lib\response.js:961:7)
at C:\Users\sainankc\Downloads\Kore.ai\SDKApp\app.js:55:7
at Layer.handle_error (C:\Users\sainankc\Downloads\Kore.ai\SDKApp\node_modules\express\lib\router\layer.js:71:5)
at trim_prefix (C:\Users\sainankc\Downloads\Kore.ai\SDKApp\node_modules\express\lib\router\index.js:310:13)
at C:\Users\sainankc\Downloads\Kore.ai\SDKApp\node_modules\express\lib\router\index.js:280:7
at Function.process_params (C:\Users\sainankc\Downloads\Kore.ai\SDKApp\node_modules\express\lib\router\index.js:330:12)
at IncomingMessage.next (C:\Users\sainankc\Downloads\Kore.ai\SDKApp\node_modules\express\lib\router\index.js:271:10)
at done (C:\Users\sainankc\Downloads\Kore.ai\SDKApp\node_modules\express\lib\response.js:956:25)
at Function.render (C:\Users\sainankc\Downloads\Kore.ai\SDKApp\node_modules\express\lib\application.js:581:14)

Thanks,
Ankit Saini


(swathi vadlamani) #5

@ankitsaini345 Can u share your index.html? I am sharing a screencap of sample index.html for your reference. The url is see is pointing to my local host. 42%20PM

If you are using Kore’s web chnanel then the URL should be “[http://demo.kore.net/users/sts”]


(Ankit Saini) #6

The problem was with the localhost URL. Now its working.

Thanks
Ankit


(swathi vadlamani) #7

Glad we could help you!
Thanks
Swathi


(Riya Sharan) #8

Hi Swathi,
I have developed an angular UI application and need to integrate the bot with the same.

How can I open the chat bot with a button in my index file?


(Juan Alejandro Perez) #9

@swathi.vadlamani Do you help me with JWT configuration? I don´t know how do it.


(Mitalee Jadhav) #10

Hi @swathi.vadlamani ,

I am also following the same tutorial (https://developer.kore.ai/docs/bots/kore-web-sdk/kore-ai-web-sdk-tutorial/) and I am also facing the same issue. I followed all the instructions you mentioned to @ankitsaini345 but still facing issue. I think I am missing something. I am attaching the snapshot of the error and index.html.

I am still not clear with the JWT url that we need to mention. Which URL we need to mention in botOptions.JWTUrl. I think the problem is with URL only. Please guide me.

Thanks & Regards,
Mitalee JadhavChatbotError Error indexhtml1 indexhtml2


(Subrahmanyam Donepudi) #11

Could you please check if the bot has been published? If not, please pass the developer email of the bot as user identity at index.html.

Once the bot is published on admin, as the bot is of purpose consumer, any identity can be passed in the index.html and the bot responds.


(Mitalee Jadhav) #12

Bot is published and I am also passing user’s email id as user identity at index.html which I have blurred.
BotStatus


(Yoga Ramya Mendu) #13

Hi @mitalee.jadhav,

Please re-check if you have implemented the following steps as per the instructions:

  • As mentioned on Step 17, you have downloaded the SDKApp.
  • As mentioned on Step 19, you have configured the index.html.
  • Try with “isAnonymous”: true also.
  • As JWT URL try with http://localhost:3000/api/users/sts .

Note: SDKApp and WebSDK are different.
Please ensure that you have unzipped the content of WebSDK into SDKApp/sdk (example: Under C:\KoreWDSK\SDKApp\sdk you should be able to see libs, UI, UI-JavaScript directories etc.)

If all the mentioned steps are correctly implemented, you should not have any issue in the command node startServer.js.

Invoke http://localhost:3000/api/users/sts in the browser.

If you get CORS error, while connecting to the chat window, then open the file - SDKApp\routes\users.js

Include the following snippet:

res.header(‘Access-Control-Allow-Origin’, “*”);

between

var token = jwt.sign(options, clientSecret);

and

res.send({“jwt”:token});

users

Now, invoke http://localhost:3000/api/users/sts in the browser to check.

We will update the documentation as per the requirement.

Regards,
Yoga Ramya,
Kore Support Team.


(Yoga Ramya Mendu) #14

Hi @jperez,

Please give us more details on your requirement/issue.

Regards,
Yoga Ramya,
Kore Support Team.


(Yoga Ramya Mendu) #15

Hi @riya.sharan,

Please find the response for this query in Integrating Bot with WebApp developed in Angular

Regards,
Yoga Ramya.


(Swagata Sengupta) #16

Mitalee,

On the error that you are getting on console, it does not stop any connectivity to bot.

In your case, you are probably serving the index.html as https://localhost:3000. You can try opening the index.html as a file (right click --> open with chrome etc.) and you will not see any error on console.

Reasons for console error while serving a page could be (not limited to) the following:

  1. If you get error on line 2830 of chatWindow.js for initGapi() function, this is only google speech related. You can get rid of this error by making

    isSpeechEnabled: false,
    allowGoogleSpeech: false,

    in index.html
  2. You may get error for missing resources - favicon.ico and libs/img/emojione.sprites.png
    You can feel free to add these resources at the mentioned path and it should work.
  3. Any other error on console - Please deal with the error on a case to case basis.

I hope this answers your question/ concern.


(Daniel Stoddart) #17

Hello,

I am facing the same issue and I’m hoping someone can advise.

I have followed all the steps of the tutorial:

https://developer.kore.ai/docs/bots/advanced-topics/kore-web-sdk/kore-ai-web-sdk-tutorial/

and have the files and folders of the web-core-sdk project in the SDKApp/sdk folder

When i load http://localhost:3000/UI/

I see:

“error verifying the jwt”

and I see this in the browser console:

bots.kore.ai/api/oAuth/token/jwtgrant:1 POST https://bots.kore.ai/api/oAuth/token/jwtgrant 401
kore-bot-sdk-client.js:324 Error: Unable to process request, received bad 401 error
at handleTransportResponse (kore-bot-sdk-client.js:840)
at Object.handleRequestTranportRes (kore-bot-sdk-client.js:1392)
at Object.wrapper [as callback] (kore-bot-sdk-client.js:7401)
at on_end (kore-bot-sdk-client.js:3212)
at XMLHttpRequest.on_state_change (kore-bot-sdk-client.js:3162)

I am using this value in the index.html:

botOptions.JWTUrl=“http://localhost:3000/api/users/sts”;

but have also tried:

botOptions.JWTUrl=“http://demo.kore.net/users/sts”;

As well as setting isAnonymous to both true and false.

Am i missing a step?

Thanks,
Dan


(Daniel Stoddart) #18

Hello,

I am also facing this issue (the issue of the original post) and I’m hoping you can help.

When loading http://localhost:3000/UI/ I see:

“error verifying the jwt”

and in the web console this:

POST https://bots.kore.ai/api/oAuth/token/jwtgrant 401
kore-bot-sdk-client.js:324 Error: Unable to process request, received bad 401 error
at handleTransportResponse (kore-bot-sdk-client.js:840)
at Object.handleRequestTranportRes (kore-bot-sdk-client.js:1392)
at Object.wrapper [as callback] (kore-bot-sdk-client.js:7401)
at on_end (kore-bot-sdk-client.js:3212)
at XMLHttpRequest.on_state_change (kore-bot-sdk-client.js:3162)

In my index.html I have this:

botOptions.JWTUrl =“http://localhost:3000/api/users/sts”;

and have also tried

botOptions.JWTUrl =“http://demo.kore.net/users/sts”;

and neither works.

I can see from the server logs that the token is being generated locally (in the SDKApp project)

I’m hoping someone can advise. My bot is published and I’ve double checked the bot info (client id, client secret etc)

Am i missing a step?

Thanks,
Dan


(Dushyant Khuran) #19

Hi Team ,

Even i am facing the same issue. I have done all the steps which are mentioned in the document. In my case i am using enterprise bot.
Could you please help me to solve this issue.

JWTerror


(Swagata Sengupta) #20

Have you started the SDKApp (node.js app)? You will need to have WedSK contents unzipped into SDK App. Start SDK App.

Hope you all have read through this post in the thread above.


(Daniel Stoddart) #21

Hello,

I resolved my issue by deleting the “Web/Mobile Client” Channel and recreating it with the H256 algo selected (maybe I had originally selected the other algo I’m not sure)

Thanks,
Dan