1
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 3 years have passed since last update.

Bot Framework Composer でボット開発 : その 9 ボットの公開

Last updated at Posted at 2020-03-27

前回は HTTP リクエストを使って他のサービスと連携する方法を見ていきました。だいぶボットも形になってきたので、この辺でボットを公開してみましょう。

Azure への展開

Bot Framework Composer で開発したボットは Azure へ数ステップで公開できます。 Azure へボットを展開するためには、まず Azure リソースの作成を行います。

前提条件

  • Azure サブスクリプション
  • Azure CLI
  • PowerShell 7
  • LuBuild: 以下コマンドでインストール
npm install -g https://botbuilder.myget.org/F/botbuilder-declarative/npm/lubuild/-/1.0.3-preview.tgz

また最新の botframework-cli のインストールも実行してください。

npm i -g @microsoft/botframework-cli

Azure リソースの作成

Bot Framework Composer は以下のリソースを作成します。

  • ボットチャンネル登録: ボットと LINE や Messenger などのクライアントをつなぐサービス
  • App Service プラン: ボットをホストする App Service 用のプランを設定
  • App Service: ボットをホストするサービス
  • Application Insights: ボットの利用状況やリソースをモニタリング
  • Azure Cosmos DB: ボットのメモリオブジェクト保存用
  • ストレージアカウント: ボットとユーザーのやり取り保存用
  • Cognitive Services: LUIS 用

1. 設定メニューより「Publish」選択。
image.png

2.「Create Azure Resources」をクリックし、設定を入力。「Next」をクリック。
image.png

3. 「Copy to Clipboard」をクリックしてコマンドをコピー。
image.png

4. コマンドプロンプトか PowerShell でコマンドを実行。5 分から 10 分程度かかる。結果は後程使うため保存しておく。
image.png

5. スクリプトの実行が完了したら Azure ポータル で作成したリソースを確認。
image.png

6. 検証中はコストがかからないよう、App Service プランを F1 に変更。
image.png

ボットの展開

1. リソースの準備が完了したら、ウィザードを進めて展開用のスクリプトを取得。
image.png

2. コマンドプロンプトか PowerShell でコマンドを実行。LUIS モデルのビルドやボットアプリのバイナリが Azure のアップロードされる。

テスト

展開が無事されたか確認します。

1. Azure ポータルよりボットチャンネル登録を開き、「Web チャットでテスト」を選択。
image.png

2. 登録や記事取得など確認。
image.png
image.png

クライアントからの接続

今回はエミュレーターと LINE から接続してみます。

エミュレーター

1. ボットチャンネル登録の「設定」より、「メッセージングエンドポイント」のアドレスをコピー。
image.png

2. Bot Framework エミュレーターを起動して「Open Bot」をクリック。
image.png

3. 取得したアドレスを入力。「Microsoft App ID」と「Microsoft App Password」は展開時に取得した値を指定。
image.png

4.「Connect」をクリックして動作を確認。
image.png

LINE

次に LINE ボットと接続してみます。

1. LINE 開発者ポータル よりプロバイダーを選択。プロバイダーが無い場合は画面に沿って作成。

2.「新しいチャネル作成」より「Messaing API」を追加。
image.png

3. ウィザードに従ってチャネルを登録。登録後、「チャネル基本設定」タブから「チャネルシークレット」をコピー。
image.png

4.「Messaging API 設定」より「チャネルアクセストークン」を発行してコピー。
image.png

5. Azure ポータルに戻り、ボットチャンネル登録より「チャンネル」を選択。LINE をクリック。
image.png

6. 取得したキーを設定し、コールバックアドレスをコピーして、「保存」をクリック。
image.png

7. LINE 開発者ポータルに戻り、取得したコールバックアドレスを設定。
image.png

8. その後表示される「Webhook の利用」を有効にする。
image.png

9. 応答メッセージ右にある「編集」をクリック。
image.png

10. Greeting message と Auto-response を無効に設定。
image.png

11. LINE クライアントよりボットを QR で読み込んで追加。
image.png

12. 動作の確認。※以下画像はデスクトップアプリで検証したもの

まとめ

Azure サブスクリプションや各種ツールなど事前の要件を満たしていれば、数ステップで公開でき、また複数のチャネルにもつながることが確認できました。作成したボットが実際のクライアントで動作するとちょっと嬉しいです。

次の記事へ
目次へ戻る

1
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
1
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?