BOT Framework: How to a create interactive and intelligent chat bot using cognitive services

Manimekalai
 
Technology Specialist
September 14, 2018
 
Rate this article
 
Views
2625

 

Every SharePoint application has a FAQ page where user can find the questions and answers on the common queries about the application. Users might find it cumbersome to find the answers by search all through the FAQ pages. To overcome this difficulty, Microsoft introduced a bot framework where user can ask their questions and bot will reply back with the answers and the knowledge base will be utilized to pre configure the QnA pair.

The first step is to create cognitive services, which requires Azure Subscription to create the cognitive and bot services.

Required access to https://www.qnamaker.ai/ (Azure account should have contributor access, Contributor access user will get access to qnamaker automatically)

Creating Cognitive Service in Azure Portal:

1. Login to Azure portal.

2. From All services, search for Cognitive services.

3. Click on Add and choose QnA Maker.

clip_image003

4. Create QnA Maker with necessary inputs like Name, Subscription, App name and Pricing tier.

clip_image005

Creating Knowledge Base(kb):

1. Once Cognitive service is created, go to https://qnamaker.ai

2. Sign in using the same account and choose create a knowledge base tab. Follow the steps as given in the above mentioned url to create a new knowledge base.

3. Skip step 1 as QnA Maker has been created already.

4. Connect QnA service to new kb by selecting Microsoft Azure Directory ID, Azure Subscription name and created QnA service name as given in step 2.

clip_image007

5. Give a name to new kb as given in step 3.

6. Can Insert a file or SharePoint Library URL where we have prebuilt FAQ. If we don’t have prebuilt FAQ, skip step 4 and create Knowledge base. The questions and answers can be added later.

7. New kb can be found under My Knowledge bases tab.

clip_image009

8. Open kb and click Add QnA pair to add questions and answers

clip_image012

Note: Multiple questions can be given to same answer.

clip_image014

9. Once Questions and answers are completed, click on ‘Save and Train’ to save the knowledge base.

10. Test button can be used to test QnA.

clip_image016

11. Publish The Knowledge base by clicking Publish tab.

12. It will be used later to connect the bot with knowledge base. The next step is creation of bot service.

Creating BOT service:

1. Go back to Azure portal.

2. Search for BOT service from All services

3. Click Add, select web app bot and create bot service with unique name.

clip_image019

4. While creating Bot choose Bot Template as Basic (C#), SDK language as C# and template as Question and Answer.

clip_image024

5. Finally click Create to create BOT.

Connecting Knowledge base to BOT:

1. Go to https://qnamaker.ai ->  My Knowledge Bases Tab -> Click on ‘View Code’ on respective KB

2. Get QnAKnowledgebaseId, QnAEndpointHostName and QnAAuthKey.

clip_image026

3. Go back to Azure portal -> Bot Services -> Choose your Bot -> on the right blade scroll down to see Application Settings.

4. Enter details (QnAAuthKey, QnAEndPointHostName, QnAKnowledgenbasedid) obtained from View Code.

clip_image029

5. Testing can be done using Test in Web Chat option.

clip_image032

6. If it is working fine, then that’s all. Now we are ready to use the BOT anywhere in the site.

Integrating BOT in a site:

1. Go back to Azure portal -> Bot Services -> Choose your Bot -> on the right blade scroll down to choose channels.

2. Select Web Chat and edit it to get embed code

3. Secret key can be obtained using Show option and replace YOUR_SECRET_HERE with obtained secret key in the Embed code.

clip_image037

4. Create a new site page in the site, click on </> Embed and paste iframe embed code here (An iframe is used to display a web page within a web page).

clip_image040

5. Now the chat BOT can be used in a site.

clip_image043

6. By default, the message will not be displayed with this configuration so we need to tweak the code to get the greet message.

7. Go back to Azure portal -> Bot Services -> Choose your Bot -> on the right blade scroll down to select Build.

8. Click on Open Online Code Editor

clip_image046

9. Click Messagescontroller.cs under Controllers and enter the mentioned script with message that to be displayed while opening chat.

clip_image050

10. Now you are ready to use your bot with default message.

Hope this helps!

Author Info

Manimekalai
 
Technology Specialist
 
Rate this article
 
Having 6 years of experience in design and development of SharePoint applications, Mani has expertise in developing applications using Office 365, SharePoint 2013 & 2010, SPFX, SP Designer Workflows, Visual ...read more
 

Leave a comment