Microsoft Bot Framework v3.0 からはじめる BOT 開発

#Microsoft Bot Framework とは
マイクロソフトが提供する、チャットのようなメッセージのやり取りを行うアプリケーションをテンプレートから簡単に作成できる＆便利な機能をまとめた(→"フレームワーク"と呼ばれている)モノです。2016年3月末のイベント //Build 2016 にて v1.0 として公開、2016年7月に最新版 v3.0 が公開されました。(まだプレビュー版として公開中)
この記事では、主に v3.0 からはじめて触ってみる人向けに、"最初の一歩"を解説します。開発は Visual Studio 2015 および C# で行います。下記手順を確認している環境は、Windows10 + Visual Studio Enterprise 2015 Update3 です。
※ 順次 Windows10 + Visual Studio 2017 (C#) の環境に変更しております。

###[参考] 今後のステップ
今回作成するテンプレートをベースとして、Bot Framework による BOT 開発を行う記事はこちら。(随時追加中)
>**Microsoft Bot Framework v3.0 からはじめるBOT開発**
>
>[コミュニケーションの基本クラス - Dialog(1)](http://qiita.com/annie/items/bd4248bb07eafcf83a3a)
[Yes/No ダイアログを表示する - Dialog(2)](http://qiita.com/annie/items/d5a3bde93944cedb268c)
[〇ブウェイがBOTで注文を受付したら - FormFlow(1)](http://qiita.com/annie/items/57cd415889d7619e6fd6)
[〇ブウェイ 注文受付 BOT をもっと丁寧に - FormFlow(2)](http://qiita.com/annie/items/41cc2d3686502a32a93f)
 → ここまでの手順で作成した [サンプルアプリ(GitHub)](https://github.com/a-n-n-i-e/BotFramework-SandwichBot/)
>
>[Azure で Web 公開＆お手軽 Web Chat を試す](http://qiita.com/annie/items/590fa480719ed93998df)
>
>
[天気予報 BOT～カード表示で分かりやすく - Adaptive Cards](http://qiita.com/annie/items/3416fcf1ec275940979a)
[天気予報 BOT～自然言語を解釈する - Cognitive Services LUIS(1)](http://qiita.com/annie/items/c55101720aee1c6d7ad6)
[天気予報 BOT～自然言語判定を組み込む - Cognitive Services LUIS(2)]
(http://qiita.com/annie/items/23b821108f9d32a0832e)
→ ここまでの手順で作成した [サンプルアプリ(GitHub)](https://github.com/a-n-n-i-e/CognitiveLUIS-AdaptiveCards-WeatherBot/)
>
>[Azure Bot Service ではじめるチャットボット開発 : 祝GA！Azure Bot Service 概略&作成～公開手順](https://qiita.com/annie/items/cf93a7a832123946a7da)


#Bot Framework を使うための開発環境
##Visual Studio 2017 または 2015
無償の Visual Studio 2017 Community でOKなので、既存の環境がない場合は、ダウンロードしてインストールします。
[Visual Studio 2017 Community ダウンロードサイト](https://www.visualstudio.com/ja-jp/products/visual-studio-community-vs.aspx)

##Bot Framework Template
[Visual Studio 用の Bot Framework C# テンプレート](http://aka.ms/bf-bc-vstemplate)
をダウンロードします。配置先は、Visual Studio のプロジェクトテンプレートディレクトリになります。
～ProjectTemplates\Visual C# というディレクトリの下にダウンロードしたテンプレートを *ZIPファイルのまま* 配置します。

>デフォルトでは
>C:\Users\ **ユーザー名** \Documents\Visual Studio 2017\Templates\ProjectTemplates
>などどなっていると思いますが、不明な場合は Visual Studio を起動して、上部のメニューバーから *ツール>オプション* を選択して
![Visual Studio のオプション設定](https://msdnshared.blob.core.windows.net/media/2016/07/bluesky_20160726_01-e1469454476685.png)
>*プロジェクトおよびソリューション>全般* をクリックすると、プロジェクトテンプレートの場所が表示されます。
![プロジェクトおよびソリューションの設定](https://msdnshared.blob.core.windows.net/media/2016/07/bluesky_20160726_02-e1469454505508.png)

##Bot Framework Emulator
作成したBOTアプリの動作確認をするためのエミュレーターです。
[Bot Framework Channel Emulator (Windows版)](https://aka.ms/bf-bc-emulator) ※Mac/Linux は [Console版](https://aka.ms/bfemulator) をご利用ください


#早速テンプレートをつかってBOTを作成してみる
##Visual Studio テンプレートから Bot アプリケーションの作成
Visual Studio 上部のメニューバーから *ファイル>新規作成>プロジェクト* を選択します。
![Visual Studio の新規プロジェクト作成](https://msdnshared.blob.core.windows.net/media/2016/07/bluesky_20160726_03-e1469454526603.png)

新しいプロジェクトというダイアログの右上にある検索ボックスに **bot** と入力し、中央の列に表示される **Bot Application** をクリックします。ひとまず、(プロジェクトの)**名前**、(プロジェクトファイルが保存される)**場所**、**ソリューション名** はデフォルトのままで右下の **OK** をクリックします。
![テンプレートから Bot アプリケーションの作成](https://msdnshared.blob.core.windows.net/media/2016/07/bluesky_20160726_04-e1469454544836.png)

>**プロジェクト** はアプリケーションに必要なファイル一式(ソースコード、アイコンやイメージ、データなど)をまとめたもので、その他ビルドに必要な情報などを含めて**ソリューション** に格納されます。
>詳細→ [MSDN: Visual Studio のソリューションおよびプロジェクト](https://msdn.microsoft.com/ja-jp/library/b142f8e7.aspx)


##Botアプリケーションのコード確認
ソリューションが作成されたら、ソリューションエクスプローラーで構成を確認します。(ソリューションエクスプローラーはデフォルトでは右側に表示されています。)
*Controllers*を開き、*MessagesController.cs*をクリックして表示します。
![Botアプリケーションのコード確認](https://msdnshared.blob.core.windows.net/media/2016/07/bluesky_20160726_05-e1469454561483.png)

チャットのハンドリングを行うコードは MessagesController.cs に含まれています。

```csharp:MessagesController.cs
private Activity HandleSystemMessage(Activity message)
        {
            if (message.Type == ActivityTypes.DeleteUserData)
            {
                // ユーザーデータ削除時のアクション、メッセージを記載
            }
            else if (message.Type == ActivityTypes.ConversationUpdate)
            {
                // メンバー追加、削除といった会話ステータスの変更を把握
                // Activity.MembersAdded, Activity.MembersRemoved,
                // Activity.Action で詳細を確認
            }
            else if (message.Type == ActivityTypes.ContactRelationUpdate)
            {
                // コンタクトリストの追加、削除
                // 詳細は Activity.From + Activity.Action で確認
            }
            else if (message.Type == ActivityTypes.Typing)
            {
                // 会話の入力時のアクション、メッセージを記載
            }
            else if (message.Type == ActivityTypes.Ping)
            {
                // Ping時のアクション、メッセージを記載
            }

            return null;
        }
```
また、 MessagesController.cs には受信した文章を解析(文字数をカウント)して返答を作成する部分も含まれています。

```csharp:MessagesController.cs
public async Task<HttpResponseMessage> Post([FromBody]Activity activity)
        {
            if (activity.Type == ActivityTypes.Message)
            {
                ConnectorClient connector = new ConnectorClient(new Uri(activity.ServiceUrl));
                // 文字数をカウント
                int length = (activity.Text ?? string.Empty).Length;

                // 返答の文章を作成
                Activity reply = activity.CreateReply(
                 $"You sent {activity.Text} which was {length} characters"
                );
                await connector.Conversations.ReplyToActivityAsync(reply);
            }
            else
            {
                HandleSystemMessage(activity);
            }
            var response = Request.CreateResponse(HttpStatusCode.OK);
            return response;
        }
```

##Botアプリケーションのローカル実行とエミュレーターによるアクセス
ひとまずこのままで動作を確認します。Windows10 のメニューから *Bot Framework Channel Emulator* という名前でインストールされているエミュレーターを起動します。

Visual Studio で F5 (デバックの開始) でビルド＆デバック実行を行います。ブラウザが起動して、Bot Application の画面が表示されたら、ローカルで Botアプリケーションが実行されています。
![Botアプリケーションのローカル実行](https://msdnshared.blob.core.windows.net/media/2016/07/bluesky_20160726_06-e1469454573584.png)

このアプリケーションにエミュレーターからアクセスを行ってみます。
ブラウザに表示されている URL が http://localhost:xxxx/ の場合、エミュレーターのアクセス先(URL)は http://localhost:xxxx/api/messages になります。(xxxxの部分は環境によって異なります)
これを Bot Framework Channel Emulator の上部中央にある Bot URL に入力します。

実際にBotにメッセージを送ってみます。エミュレーターの下枠に入力(+Returnで送信)を行うと、下記のような情報が表示されます

+ 右枠：Botアプリケーション内で生成・管理されているメッセージやユーザーの情報、返答内容　(JSON形式で表示)
+ 左枠：Botとしての返答メッセージ

![エミュレーターからBotアプリケーションへのアクセス](https://msdnshared.blob.core.windows.net/media/2016/07/bluesky_20160726_07-e1469454587566.png)

以上、Bot Framework 開発の "最初の一歩" は完了です。