Microsoft Bot FrameworkをMicrosoft Azureにデプロイするチュートリアルをかみ砕いてみた

# はじめに
タイトルの通りです。Microsoft Bot Frameworkのチュートリアルで詰まりまくって具体的なパラメータをどう与えればいいのかわからなかったので、具体的な例を作って整理してみました。CMD上からのAzureログインからデプロイまで。

# 参考資料・前提条件
これの「ボットをデプロイする」の直前までが終わっていることが前提です。
[基本的なボットの作成とデプロイに関するチュートリアル - Bot Service | Microsoft Docs](https://docs.microsoft.com/ja-jp/azure/bot-service/bot-builder-tutorial-basic-deploy?view=azure-bot-service-4.0&tabs=javascript)

# 作業
## 1. Microsoft Azureにログインする。
Microsoft Azureにログインします。cmdでコマンドを叩くとそのままブラウザが立ち上がり、ブラウザ上でログインすることができます。

~~~:cmd
az login
~~~

## 2. アカウントリストを取得する
下記のコマンドを入力し、アカウントリストを取得します。

~~~:cmd
az account list
~~~

すると、このような感じでサブスクリプションのデータが出てきます。

~~~:cmd-こんなサブスクリプションデータだったとする
[
  {
    "cloudName": "AzureCloud",
    "id": "piyopiyo-piyo-nyan-nyan-hogehogehoge",
    "isDefault": true,
    "name": "無料試用版",
    "state": "Enabled",
    "tenantId": "hoge-hoge-fuga-fuga-piyopiyo",
    "user": {
      "name": "*****@hogehoge.com",
      "type": "user"
    }
  }
]
~~~
以降、これを使って説明していきます。

## 3. Azureのサブスクリプションにアクセスする

サブスクリプションの指定はcmd上で次のように入れます。チュートリアルの`<azure-subscription>`とは、上でいうところの`"id"`が対応します。

~~~:cmd
az account set --subscription "piyopiyo-piyo-nyan-nyan-hogehogehoge"
~~~

## 4. アプリケーションを登録する
アプリを作ります。

~~~:cmd
az ad app create --display-name "samplebot_hoge2" --password "password_hogefuga1" --available-to-other-tenants
~~~

`--display-name`:名前です。サンプルは適当(samplebot_hoge2)です。
`--password`:パスワードです。サンプルは適当(password_hogefuga1)です。

これを実行して問題なく作成できると、JSON形式でいろいろと出てきますが、`appId`というGUIDをそのまま使用するので、控えておきましょう。

~~~:出てくるもの
{
  "acceptMappedClaims": null,
  "addIns": [],
  "allowGuestsSignIn": null,
  "allowPassthroughUsers": null,
  "appId": "fugafuga-piyo-piyo-piyo-hogehogehoge",
  "appLogoUrl": null,
...
~~~

~~~:控えておくべき情報
  "appId": "fugafuga-piyo-piyo-piyo-hogehogehoge",
~~~


## 5. ARM テンプレートを使用してデプロイする

ここからがめちゃくちゃ詰まりました。値のそれぞれの意味を整理しています。

### そもそもARMテンプレートってなに
ARMはAzure Resource Managerの略であり、そのテンプレートをベースにすることでAzure内でうまくデプロイできるようです。すごい便利なんだなぁ、と思いました（小並感）
より詳しくは@t-tsurumiさんの[AzureのARMテンプレートを理解する part1（基本編）](https://qiita.com/j-tsurumi/items/cc86e9412349da80a323)が参考になるかと思います。

### App Service Planがないとき
最初からやってみているときにはチュートリアルの「App Service Planがないとき」を実施しましょう。

~~~:cmd
az deployment create 
--name "samplebot-1gou" 
--template-file "./deploymentTemplates/template-with-new-rg.json" 
--location "centralus" 
--parameters 
appId="fugafuga-piyo-piyo-piyo-hogehogehoge" 
appSecret="password_hogefuga1" 
botId="samplebotkun03" 
botSku=F0 
newAppServicePlanName="new-sample-bot-plan-99" 
newWebAppName="newsamplebotkun-0X" 
groupName="atarashii-group" 
groupLocation="Central US" 
newAppServicePlanLocation="japaneast"
~~~

与える値の内容は下記

|項目|項目名|任意|備考|
|---|:---|:---|:---|
|`--name`|-|任意|わかりやすいボットの名称。適当につけてOK|
|`--template-file`|-|既存|テンプレートファイル`template-with-new-rg.json`が参照できるようにパスを入れてあげる。`template-with-new-rg.json`はボットの作成時に自動で生成される|
|`--location`|-|既存|ロケーション。値は`az account list-locations`をcmd上で叩いて確認。jsonの形式で出力されるので`name`項目を入れる|
|`--parameters`|appId|既存|4で作成したappIdのGUID|
|`--parameters`|appSecret|既存|4で作成した`--password`のパスワード|
|`--parameters`|botId|任意|自分が作ったボットの名称。任意|
|`--parameters`|botSku|既定|価格レベル。F0 (無料) または S1 (Standard) を指定できる|
|`--parameters`|newWebAppName|任意|Webアプリとして展開するための名称。任意|
|`--parameters`|newAppServicePlanName|任意|アプリサービスの名称。任意|
|`--parameters`|newWebAppName|任意|アプリサービスの名称。任意|
|`--parameters`|newAppServicePlanLocation|既定|リソースタイプに応じて決まったロケーションが定義されている。エラーの記載で詳しく教えてくれる。|

## 6. デプロイ用のコードを準備する
ボットのルートディレクトリ上で、下記コマンドをそのまま実行します。
言語ごとに決まっていますが、下記の例はTypescriptです。成功するとweb.configができます。

~~~:cmd
az bot prepare-deploy --code-dir "." --lang Typescript
~~~

Kuduと呼ばれるAzure WebAppsで利用されているデプロイエンジンを用いてデプロイします。
そのために、まずは、フォルダの中身を下記のようにすべて選択してzip圧縮します。zipファイル名をcode.zipとします。

![sample.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/541975/516377d4-98fe-e3c1-3d65-605e97a776ef.png)|
|:-:|

その後、下記のようにコマンドを叩きます。

~~~:cmd
az webapp deployment source config-zip --resource-group "atarashii-group" --name "newsamplebotkun-0X" --src "code.zip" 
~~~

|項目|項目名|任意|備考|
|---|:---|:---|:---|
|`--resource-group`|-|既存|アプリケーションを作成したリソースグループ名|
|`--name`|-|既存|5で定義した`newWebAppName`の値|
|`--src`|-|既存|直前の手順で作成したzipファイル名|

これが正常に終了して、結果のJSONが出力されればデプロイは完了です。

## 7.実際に動かしてみる

のこりはチュートリアルに従えばあまり詰まらずに実行することができます。
[Web チャットでのテスト | 基本的なボットの作成とデプロイに関するチュートリアル - Bot Service | Microsoft Docs](https://docs.microsoft.com/ja-jp/azure/bot-service/bot-builder-tutorial-basic-deploy?view=azure-bot-service-4.0&tabs=typescript%2Ccsharp#test-in-web-chat)

#エラー対応
## Deployment failed. Correlation ID: ***
デプロイが失敗したことを示しています。Correlation ID（関連ID）に基づいて、ポータルなどでエラーの詳細を参照できます。

詳細はこちらを見ると結構わかりやすいと思います。
[Azure Resource Manager でのデプロイ履歴の表示](https://docs.microsoft.com/ja-jp/azure/azure-resource-manager/templates/deployment-history?view=aspnetcore-1.0&tabs=azure-portal)

##  The Microsoft App ID property was not recognized as a GUID and may be invalid.

###原因
MicrosoftAppID が正しく選択されていないのが問題です。

###解決策
アプリケーションを初回登録した際に発行されるJSONに含まれているappIdを参照してください。cmdに自分で打ち込んだアプリの名称ではないことに注意しましょう。

#参考資料
+ [基本的なボットの作成とデプロイに関するチュートリアル - Bot Service | Microsoft Docs](https://docs.microsoft.com/ja-jp/azure/bot-service/bot-builder-tutorial-basic-deploy?view=azure-bot-service-4.0&tabs=javascript)
+ [Azure Resource Manager でのデプロイ履歴の表示](https://docs.microsoft.com/ja-jp/azure/azure-resource-manager/templates/deployment-history?view=aspnetcore-1.0&tabs=azure-portal)
+ [AzureのARMテンプレートを理解する part1（基本編）](https://qiita.com/j-tsurumi/items/cc86e9412349da80a323)