{"id":27669,"date":"2018-12-25T09:58:44","date_gmt":"2018-12-25T16:58:44","guid":{"rendered":"http:\/\/devblogs.microsoft.com\/premier-developer\/?p=27669"},"modified":"2019-02-14T20:17:39","modified_gmt":"2019-02-15T03:17:39","slug":"build-an-interactive-assistant-using-qna-maker","status":"publish","type":"post","link":"https:\/\/devblogs.microsoft.com\/premier-developer\/build-an-interactive-assistant-using-qna-maker\/","title":{"rendered":"Build an interactive assistant using QnA Maker"},"content":{"rendered":"<p>Senior App Dev Manager <a href=\"https:\/\/www.linkedin.com\/in\/patelnayan\/\">Nayan Patel<\/a> walks us through how to build an interactive assistant using QnA Maker.<\/p>\n<hr \/>\n<p>I was recently engaged in a customer proof of concept scenario where they needed to turn their knowledgebase articles, FAQ\u2019s and other company data into an interactive bot. For our scenario, we created a QnA Maker service that pulled HR information from a backend database so users can ask common questions in a conversational way instead of wasting time searching and scrolling through content. We leveraged the QnAMaker service which was announced general availability at Build 2018. The service basically creates a question-answering endpoint on top of your existing data, whether it\u2019s a database, word\/excel files, pdf or URL\u2019s.<\/p>\n<p>Below are the steps to spin up a chatbot in just a few minutes using the QnA Maker service.<\/p>\n<p>Go to the <a href=\"https:\/\/www.qnamaker.ai\/\">QnA Maker site<\/a> and on the \u2018Create a knowledge base\u2019 tab, click \u2018Create a QnA service\u2019.<\/p>\n<p><a href=\"https:\/\/devblogs.microsoft.com\/premier-developer\/wp-content\/uploads\/sites\/31\/2019\/01\/qna1.png\"><img decoding=\"async\" title=\"qna1\" src=\"https:\/\/devblogs.microsoft.com\/premier-developer\/wp-content\/uploads\/sites\/31\/2019\/01\/qna1_thumb.png\" alt=\"qna1\" width=\"644\" height=\"326\" border=\"0\" \/><\/a><\/p>\n<p>This will redirect you to your Azure portal to setup the service. Fill in all the required fields and hit \u2018Create\u2019.<\/p>\n<p><a href=\"https:\/\/devblogs.microsoft.com\/premier-developer\/wp-content\/uploads\/sites\/31\/2019\/01\/qna21.png\"><img decoding=\"async\" title=\"qna2\" src=\"https:\/\/devblogs.microsoft.com\/premier-developer\/wp-content\/uploads\/sites\/31\/2019\/01\/qna2_thumb1.png\" alt=\"qna2\" width=\"240\" height=\"772\" border=\"0\" \/><\/a><\/p>\n<p>Once the service is deployed, go back to the QnA Maker site and fill in the rest of the fields to connect your service and create the KB. Note, our newly create SPOQnAbot service is selected in the Azure QnA service dropdown. For this example, I have used the QnA Maker FAQ site that the knowledgebase will extract Q&amp;A pairs from.<\/p>\n<p><a href=\"https:\/\/devblogs.microsoft.com\/premier-developer\/wp-content\/uploads\/sites\/31\/2019\/01\/qna31.png\"><img decoding=\"async\" title=\"qna3\" src=\"https:\/\/devblogs.microsoft.com\/premier-developer\/wp-content\/uploads\/sites\/31\/2019\/01\/qna3_thumb1.png\" alt=\"qna3\" width=\"703\" height=\"772\" border=\"0\" \/><\/a><\/p>\n<p>The KB will extract content from the <a href=\"https:\/\/azure.microsoft.com\/en-us\/services\/cognitive-services\/qna-maker\/faq\/\">QnA Maker FAQ<\/a> site and form Q&amp;A pairs. You can also add your own question\/answer pairs based on commonly asked user questions and \u2018Save and retrain\u2019 your bot. You can now publish your KB.<\/p>\n<p><a href=\"https:\/\/devblogs.microsoft.com\/premier-developer\/wp-content\/uploads\/sites\/31\/2019\/01\/qna41.png\"><img decoding=\"async\" title=\"qna4\" src=\"https:\/\/devblogs.microsoft.com\/premier-developer\/wp-content\/uploads\/sites\/31\/2019\/01\/qna4_thumb1.png\" alt=\"qna4\" width=\"1028\" height=\"344\" border=\"0\" \/><\/a><\/p>\n<p>Save the <b>KnowledgebaseId<\/b>, <b>EndpointHostname<\/b>, and <b>AuthKey<\/b> values as they will be used to setup your bot.<\/p>\n<p><a href=\"https:\/\/devblogs.microsoft.com\/premier-developer\/wp-content\/uploads\/sites\/31\/2019\/01\/qna51.png\"><img decoding=\"async\" title=\"qna5\" src=\"https:\/\/devblogs.microsoft.com\/premier-developer\/wp-content\/uploads\/sites\/31\/2019\/01\/qna5_thumb1.png\" alt=\"qna5\" width=\"1028\" height=\"415\" border=\"0\" \/><\/a><\/p>\n<p>Go to the Azure portal and Create a new Web App Bot using the \u2018Question and Answer\u2019 Bot template as shown below.<\/p>\n<p><a href=\"https:\/\/devblogs.microsoft.com\/premier-developer\/wp-content\/uploads\/sites\/31\/2019\/01\/qna61.png\"><img decoding=\"async\" title=\"qna6\" src=\"https:\/\/devblogs.microsoft.com\/premier-developer\/wp-content\/uploads\/sites\/31\/2019\/01\/qna6_thumb1.png\" alt=\"qna6\" width=\"726\" height=\"772\" border=\"0\" \/><\/a><\/p>\n<p>Once deployed, go to the \u2018Application Settings\u2019 and copy the <b>KnowledgebaseId<\/b>, <b>EndpointHostname<\/b>, and <b>AuthKey <\/b>values from the QnA Maker site to the <b>QnAAuthkey<\/b>, <b>QnAEndpointHostname<\/b> and <b>QnAKnowledgebaseId<\/b> fields as shown below.<\/p>\n<p><a href=\"https:\/\/devblogs.microsoft.com\/premier-developer\/wp-content\/uploads\/sites\/31\/2019\/01\/qna71.png\"><img decoding=\"async\" title=\"qna7\" src=\"https:\/\/devblogs.microsoft.com\/premier-developer\/wp-content\/uploads\/sites\/31\/2019\/01\/qna7_thumb1.png\" alt=\"qna7\" width=\"1028\" height=\"743\" border=\"0\" \/><\/a><\/p>\n<p>When deploying a web app bot, it is deployed as a \u201cWeb Chat\u201d channel by default (can also connect to Teams, Cortana, Slack etc.). Go to channels and hit \u201cGet bot embed codes\u201d:<\/p>\n<p><a href=\"https:\/\/devblogs.microsoft.com\/premier-developer\/wp-content\/uploads\/sites\/31\/2019\/01\/qna81.png\"><img decoding=\"async\" title=\"qna8\" src=\"https:\/\/devblogs.microsoft.com\/premier-developer\/wp-content\/uploads\/sites\/31\/2019\/01\/qna8_thumb1.png\" alt=\"qna8\" width=\"1028\" height=\"350\" border=\"0\" \/><\/a><\/p>\n<p>In the configuration page, click on \u201cShow\u201d to reveal one of the secret keys (either will do). Copy the contents of the \u201cEmbed code\u201d text box to somewhere else, and replace \u201cYOUR_SECRET_HERE\u201d with the secret key:<\/p>\n<p><a href=\"https:\/\/devblogs.microsoft.com\/premier-developer\/wp-content\/uploads\/sites\/31\/2019\/01\/qna91.png\"><img decoding=\"async\" title=\"qna9\" src=\"https:\/\/devblogs.microsoft.com\/premier-developer\/wp-content\/uploads\/sites\/31\/2019\/01\/qna9_thumb1.png\" alt=\"qna9\" width=\"1028\" height=\"495\" border=\"0\" \/><\/a><\/p>\n<p>You can now embed the iframe code in your web page and start interacting with your new bot.<\/p>\n<p>The chatbot can be retrained over time based on user interactions. You can also add multiple QnA Maker services for different departments (HR KB, Finance KB etc.) in conjunction with a LUIS app to identify the user intent and route the incoming question to the appropriate knowledge base.<\/p>\n<p><a href=\"https:\/\/devblogs.microsoft.com\/premier-developer\/wp-content\/uploads\/sites\/31\/2019\/01\/qna10.png\"><img decoding=\"async\" title=\"qna10\" src=\"https:\/\/devblogs.microsoft.com\/premier-developer\/wp-content\/uploads\/sites\/31\/2019\/01\/qna10_thumb.png\" alt=\"qna10\" width=\"494\" height=\"484\" border=\"0\" \/><\/a><\/p>\n","protected":false},"excerpt":{"rendered":"<p>I was recently engaged in a customer proof of concept scenario where they needed to turn their knowledgebase articles, FAQ\u2019s and other company data into an interactive bot. For our scenario, we created a QnA Maker service that pulled HR information from a backend database so users can ask common questions in a conversational way instead of wasting time searching and scrolling through content.<\/p>\n","protected":false},"author":582,"featured_media":27670,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[80,25],"tags":[24,115,958,3],"class_list":["post-27669","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-net","category-azure","tag-azure","tag-bot-framework","tag-qna-maker","tag-team"],"acf":[],"blog_post_summary":"<p>I was recently engaged in a customer proof of concept scenario where they needed to turn their knowledgebase articles, FAQ\u2019s and other company data into an interactive bot. For our scenario, we created a QnA Maker service that pulled HR information from a backend database so users can ask common questions in a conversational way instead of wasting time searching and scrolling through content.<\/p>\n","_links":{"self":[{"href":"https:\/\/devblogs.microsoft.com\/premier-developer\/wp-json\/wp\/v2\/posts\/27669","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/devblogs.microsoft.com\/premier-developer\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/devblogs.microsoft.com\/premier-developer\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/premier-developer\/wp-json\/wp\/v2\/users\/582"}],"replies":[{"embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/premier-developer\/wp-json\/wp\/v2\/comments?post=27669"}],"version-history":[{"count":0,"href":"https:\/\/devblogs.microsoft.com\/premier-developer\/wp-json\/wp\/v2\/posts\/27669\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/premier-developer\/wp-json\/wp\/v2\/media\/27670"}],"wp:attachment":[{"href":"https:\/\/devblogs.microsoft.com\/premier-developer\/wp-json\/wp\/v2\/media?parent=27669"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/premier-developer\/wp-json\/wp\/v2\/categories?post=27669"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/premier-developer\/wp-json\/wp\/v2\/tags?post=27669"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}