Create AI Chatbot using Microsoft Bot Framework – Part 2

In the last post,we have built Q&A service using  Microsoft QnA Maker & have published it.In this post,we will look at how to build a bot that uses the QnA service.Just to recap,Azure Bot Service which provides an integrated environment that is purpose-built for bot development, enabling us to build, connect, test, deploy, and manage bots, all from one place. It is powered by Microsoft Bot Framework and Azure Functions, which means that bot will run in a server-less environment on Azure that will scale based upon demand.

Following is outline of this post :

  1. Create Azure service bot.
  2. Enable Web chat channel on the bot.
  3. Embed the web chat on the website.

Pre-requisites:

  1. Microsoft Account for generating AppID for your bot.
  2. Microsoft Azure subscription to use Azure Bot service.

Now we will head over to Azure management portal,once you login under Data + Analytics category, and select Bot Service.

  1. In the Bot Service blade, provide the required information, and click Create to create the bot service and deploy it to the cloud.
    • Set App name to required bot’s name. The name is used as the sub domain when the bot is deployed to the cloud (for example, demoqnamaker.azurewebsites.net).
    • Select the subscription to use.
    • Select the resource group and location.Either you can create new or use existing.

      Set App name,Subscription to use,resource group and location.
  2. On the next page,create an app ID and password for your bot, so that it will be able to authenticate with the Bot Framework.
    • On click of ‘Create Microsoft App ID and Password’,click Generate an app password to continue.
    • Copy and store the password that is shown, and then click Ok.
    • Click Finish and go back to Bot Framework.
    • Back in the Azure Portal, the app ID field is now auto-populated for you. Paste the password that you copied (in step above) into the password field.
      Click ‘Create Microsoft App ID and password’ to continue
      App ID generated.
      Note down the password so that we can use it in the next step.

      Both App ID and Password generated,click ‘Finish and go back to Bot Framework’ to go back to Azure portal
  3. Choose the programming language to develop the bot,here I have opted for C#.Also there is an option to choose the Bot template,make sure to select it as ‘Question and Answer’
    • Now we have to select service which we have created in the last post,here its ‘Demo’ and then click Ok.
      Select Language & make sure to select the template as ‘Question and Answer’

      Choose the QnA service we created earlier
  4. When the bot service finishes generating bot, the Azure editor will contain the bot’s source files. At this point, the bot has been created, registered with the Bot Framework, deployed to the cloud, and is fully functional.

    Congratulations! You’ve successfully created a bot!
  5. Now that bot is up and running in the cloud, we can try it out by typing a few messages into the built-in chat control that’s located to the right of the code editor in portal. Bot responds to each message by echoing back your message prefixed with the text You and response by the name of your bot.
    Now the bot is ready,we can try out with some questions to check response

    Now the bot is ready,we can try out with some questions to check response
  6. Next step is to enable web chat channel,this can be done by clicking on the ‘Channels’ tab on the top bar.Once you’re in channel settings,you can customize the look and feel of the button and you can get embed code at the bottom left portion of the page.
    Enable Webchat channel

    Webchat channel customization,copy embed code to use it in page/website.
  7. Once you have the embed code ,same can be embedded to the page/website you wish.
    Congratulations! Your 1st Bot is ready.

     

    Now that you’ve created your first bot,there is more to explore.Just recap of what we have done

    1. Create Q&A knowledge base.
    2. Create Azure service bot.
    3. Enable Web chat channel on the bot.
    4. Embed the web chat on the website.

If you want to explore more,please check the links below.

I hope you have enjoyed learning along with me.If you have questions,please share it on the comments section.

Leave a Reply

Your email address will not be published. Required fields are marked *