Azure Bot ServiceとQnA MakerでFAQのbotを作り、Slackと連携する

#概要
Cognitive ServicesのFunctions Botと[QnA Maker](https://qnamaker.ai/ "QnA Maker")を使用してノンコーディングでFAQができるBotを作りたいと思います。
その後、Slackと連携してSlack上から簡単に質問ができるようにします。

#QnA Maker
##新規作成

1. [QnA Maker](https://qnamaker.ai/ "QnA Maker")にアクセスをし、Create new serviceを選択します。
![2018-02-17_00h35_14.png](https://qiita-image-store.s3.amazonaws.com/0/144491/93c4a4f1-fe34-72d3-af6d-478c340765b6.png)

2. サインインをしていない場合はサインインを求められるのでお持ちのMicrosoft Accountでサインインしてください。

3. Creating a QnA serviceのページに遷移するので必要事項を入力します。(初回の場合利用規約への同意画面が出てくるのでI agree to...にチェックを入れ、Continueをクリックします。)
![2018-02-17_00h42_44.png](https://qiita-image-store.s3.amazonaws.com/0/144491/92e1c286-5066-4db6-56c6-d3581d70f135.png)

- SERVICE NAME  
QnAのサイトで表示される名前です。自分の分かりやすい名前を付けるとよいと思います。
- URL(S)  
元にしたいFAQサイトがある場合にここにURLを入力すると自動でページを解析し、追加してくれます。  
- FILES  
元にしたいファイルがある場合はここに追加します。使用できる拡張子などを確かめて追加しましょう。

今回はURL(S)に[Azure サポートに関する FAQ](https://azure.microsoft.com/ja-jp/support/faq/)を使用しました。
入力が完了したらCreateボタンをクリックします。
![2018-02-17_00h53_29.png](https://qiita-image-store.s3.amazonaws.com/0/144491/73947f14-2b72-b4cc-a6f9-1154c8a1c47d.png)

4.作成完了
FAQを手動で追加したい場合は右側の「Add new QnA pair」を、URLからまとめて追加したい場合は左側のSettingから追加することが出来ます。
![2018-02-17_00h57_29.png](https://qiita-image-store.s3.amazonaws.com/0/144491/60d999de-6f70-4d88-654d-654ad934bed1.png)

##Test
ここまでで作成が完了したのでにTestを行います。
Testタブを選択して先ほど設定した質問をします。設定した答えが正しく返ってきたら成功です。
![2018-02-17_01h11_52.png](https://qiita-image-store.s3.amazonaws.com/0/144491/a3163e2d-98f5-a52f-172a-bfc65593a348.png)


##保存＆学習＆公開
最後に「Save and retrain」を行ってから「Publish」をします。
![2018-02-17_01h05_56.png](https://qiita-image-store.s3.amazonaws.com/0/144491/c01abd4c-0e79-8efe-d062-e6cb68aa2912.png)

このような画面が表示されるのでPublishをクリックし、公開完了です。
![2018-02-17_01h14_30.png](https://qiita-image-store.s3.amazonaws.com/0/144491/a218402f-3ba5-dd7c-aace-347a6a173b4d.png)

##Azure Bot Serviceで使用するキーをメモする
完了後に遷移する画面でこの2つをメモしておきます。後でAzure Bot Serviceとの連携の際に使用します。
![2018-02-17_01h32_49.png](https://qiita-image-store.s3.amazonaws.com/0/144491/1cf35acc-9075-e9f7-4fa2-c968d9090647.png)

#Azure Bot Service
##新規作成
1. [Azure](https://portal.azure.com/)にアクセスし、リソースの作成から「bot」で検索します。
![2018-02-17_01h19_43.png](https://qiita-image-store.s3.amazonaws.com/0/144491/98838442-1f1d-51f4-a41d-b9bda55f6eb7.png)

2. このような結果が表示されるので今回は「Functions Bot」を選択し、作成します。
![2018-02-17_01h20_46.png](https://qiita-image-store.s3.amazonaws.com/0/144491/869ac570-52c9-04be-1b9a-e900d689df1e.png)

3. ボット名などは自由に付けますが「ボットテンプレート」を必ずQuestion and Answerに変更してください！！
![2018-02-17_01h24_23.png](https://qiita-image-store.s3.amazonaws.com/0/144491/f18935c4-e54e-b74c-2802-9719652c34c5.png)

4. しばらく待つとデプロイが完了するので追加されたものの中から「Functions Bot」となっているものを選択します。
![2018-02-17_01h28_33.png](https://qiita-image-store.s3.amazonaws.com/0/144491/b46ed5e3-e5a3-7540-ba20-14f7978459cd.png)

5.アプリケーション設定から「QnAKnowledgebaseId」「QnASubscriptionKey」にそれぞれ先ほどメモした値を入力します。
![2018-02-17_01h31_31.png](https://qiita-image-store.s3.amazonaws.com/0/144491/8d7032c4-a64a-887f-142a-87bbb8e73e89.png)

6.Azure上でもテストをしてみます。これで正しい答えが返ってくればひとまずBotとしては完成です。
![2018-02-17_01h52_04.png](https://qiita-image-store.s3.amazonaws.com/0/144491/cd3f3482-f64b-2feb-196c-594ecc6d16df.png)

#Slackと連携する
毎回Azureのポータルからアクセスするのは面倒なのでSlackに質問を投げるとBotが反応し、答えを返してくれるようにします。

##Slackのアプリを作成する
1. [create a Slack application.](https://api.slack.com/apps)からCreate New Appを選択し、新しいアプリを作ります。
2. 必要事項を入力し、「Create App」をクリックします。
![2018-02-17_02h00_51.png](https://qiita-image-store.s3.amazonaws.com/0/144491/7c0fe1ac-2a03-416d-2208-fad23c314367.png)
3. Basic Informationにある「App Credentials」の内容が後で必要になります。
![2018-02-17_02h03_27.png](https://qiita-image-store.s3.amazonaws.com/0/144491/bdbdddbe-8d5f-5986-3b1b-50c35caf62a8.png)
4. OAuth & Permissionsにある「Redirect URLs」にhttps://slack.botframework.com/Dev/Validate を追加し、「Save URLs」をクリックします。
![2018-02-17_02h06_40.png](https://qiita-image-store.s3.amazonaws.com/0/144491/bfd3fe5b-7766-53b1-ca7e-df2df510a639.png)

##Functions Botの設定をする
1. チャンネルの「More channel」の中にSlackがあるので(今回は追加済みのため表示が消えてしまっています)選択します。
![2018-02-17_02h09_36.png](https://qiita-image-store.s3.amazonaws.com/0/144491/d1dc0a45-5413-c670-990d-31133d02853c.png)

2. 資格情報を入力する欄が出てくるので先ほど見た「App Credentials」の内容を入力し、保存します。
![2018-02-17_02h11_48.png](https://qiita-image-store.s3.amazonaws.com/0/144491/374b27e2-9550-f1a4-c9cd-0be44fe58240.png)

##使用したいchannelにBotを追加
Basic InformationのBuilding Apps for Slackの設定を行うと自分のchannelにBotを追加することが出来ます。
![2018-02-17_02h14_40.png](https://qiita-image-store.s3.amazonaws.com/0/144491/b18c93b0-f3ba-645b-d319-a9261ff87b0a.png)
![2018-02-17_02h15_19.png](https://qiita-image-store.s3.amazonaws.com/0/144491/bb710b7f-5c31-c0d8-4f04-25441001c5c5.png)
#完成！！
これでSlackから作成したFAQのBotにアクセスすることが出来るようになりました。
![2018-02-17_02h18_32.png](https://qiita-image-store.s3.amazonaws.com/0/144491/79218997-d082-bbb6-a078-b5d1a49f5607.png)

#参考
- [Azure BOT Service とCognitive Service QnA MakerでFAQのBOTを作る](https://qiita.com/taiki_yoshida/items/d48d6286ce5b8f3aa2a8#skype-bot%E3%82%92%E4%BD%9C%E6%88%90%E3%81%99%E3%82%8B)
- [Azure Bot Service ではじめるチャットボット開発 : 祝GA！Azure Bot Service 概略&作成～公開手順](https://qiita.com/annie/items/cf93a7a832123946a7da#%E6%BA%96%E5%82%99)