【QnA Maker + Azure Bot Service】AIサービスを利用して簡単にFAQ Botを作成
こんにちは。ソリューション開発部 情報発信分科会の飯出(いいで)です。
今回は、QnA Maker で作成した FAQ データベースを「Azure Bot Service」を使って Web チャットとして公開してみます。QnA Maker を使った FAQ データベースの作成方法については、前回までの記事をご覧ください。
https://devlog.arksystems.co.jp/2018/08/29/5606/
QnA Maker の API を公開する
FAQ データベースの内容を Web チャットに接続するには、まず QnA Maker の API を外部に公開します。
作成済みの FAQ データベースを選ぶ
まず、QnA Maker のコンソール画面を開きましょう。また URL を忘れた？こちらです。
https://www.qnamaker.ai/[My knowledge bases] をクリックして、サービスの一覧画面を開きます。
![[My knowledge bases] をクリックして、サービスの一覧画面を開きます。](https://devlog.arksystems.co.jp/wp-content/uploads/2018/07/QnAMaker_10.jpg)
サービスの一覧画面にて、前回までの記事で作成した FAQ データベース「TrialFAQ」をクリックして開きます。
前回までに作成した FAQ データベースの中身を見ることができました。
API を公開する
QnA Maker で作成した FAQ データベースを、HTTP エンドポイントとして公開します。画面上部のメニューにある [PUBLISH] をクリックします。
以下のような画面表示となります。ここで [Publish] をクリックすると、 FAQ データベースを公開できます。
HTTP リクエストのサンプルが表示されれば成功です！ここに表示された内容は、別途テキストエディタなどに保存しておいてください。あとで使います。
Azure Bot Service と連携する
今回は Azure Bot Service の Web App Bot を使って、QnA Maker と連携します。
Bot Service を作成する
Azure 上に Bot Service 用の領域を作成します。Azure Portal から [リソースの作成] をクリックし、[すべて表示] をクリックします。
その後、[AI + Machine Leaning] → [Web App Bot] の順番でクリックします。[Web App Bot] をクリックした後に、画面右側が更に展開し、 [作成] ボタンが表示されたらクリックしてください。
続いて、Web アプリ ボットの各項目を入力・選択していきます。
- ボット名: TrialFAQ-Bot
- ボット テンプレート: Question and Answer (C#)
として進めます。
場所や価格レベルについては、利用状況にあった項目を選択してください。入力し終わったら、[作成]ボタンをクリックしましょう。
[作成] ボタンをクリックした後、デプロイが完了するまで少々時間が掛かります。
QnA Maker に接続する
たった今作成した Azure Web App と FAQ データベースを格納している QnA Maker をここで接続します。
[リソースグループ] をクリックし、表示された一覧から [TrialFAQ-Bot] をクリックします。
もう一度、[TrialFAQ-Bot] をクリック。
[アプリケーション設定] をクリック。
設定する項目は以下の3つです。画面を下方向にスクロールすると、当該項目が見えてきます。
- QnAAuthKey
- QnAEndpointHostName
- QnAKnowledgebaseId
QnA Maker を公開した際に表示された HTTP エンドポイントの Sample HTTP request 欄を見ながら設定します。
POST /knowledgebases/{QnAKnowledgebaseId}/generateAnswer
Host: {QnAEndpointHostName}
Authorization: EndpointKey {QnAAuthKey}
Content-Type: application/json
{"question":"<Your question>"}
設定したら、[保存] してください。
これで繋がる。はずです（笑）
テストをする
[Web チャットでテスト] をクリックすると、以下の画面が表示されます。ここから、動作確認ができます。
では、前回の記事で質問として用いた「事業内容は？」と、質問してみます。
ちゃんと回答していますね！
Web サイトへの埋め込み
作成した Web チャットを、実際の Web サイトに埋め込んでみます。
準備
[チャンネル] → [ボットの埋め込みコードを取得] の順にクリックします。
[Web Chat の構成ページを開くには、ここをクリックします ＞] をクリック。
シークレットキーと埋め込みコードを取得します。[表示] をクリックしてシークレットキーを表示し、コピーしてください。埋め込みコードも一緒にコピーしましょう。
Web ページの作成と表示
今回はシンプルな Web ページを作成し、その中で Web チャットを動かします。埋め込みコードにシークレットキーを反映したタグを、HTML 内に含めます。幅、高さの調整はお好みでどうぞ。
HTML サンプル
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="utf-8" />
<title>Web チャットのサンプル</title>
</head>
<body>
<iframe width="600px" height="800px" src='https://webchat.botframework.com/embed/TrialFAQ-Bot?s=シークレットを入力'></iframe>
</body>
</html>
完成しました！
まとめ
ここまで早い人で30分、時間が掛かっても1時間あればたどり着けるのではないでしょうか。
事前に FAQ サイトなどが準備できていれば、ノンプログラミングかつ簡単に AI サービスを使ったチャット Bot が作成できてしまいます。今回は紹介しませんが、Skype や Slack を使った形でも同じくらいの手間で構築できると思います。
実運用に耐える FAQ Bot に仕上げるには、ここからが本番です。質問に対する回答の精度向上、チャット上での質問の選択肢提供やデザインの洗練化など、まだまだやる事がたくさんありますね。
機会がありましたら、今後はこのような内容にも触れていきたいと思います。ありがとうございました。
