【Microsoft BotFramework X LUIS X Pepper】PepperとBOTを繋いでみよう!〜その1:土台作り編〜


「偉業も小さな一歩から!」

今更ながらPS4を買いました。最近のグラフィックの進化はすごいですよねぇ。PS3の並列処理に感嘆の声をあげていた時代が懐かしいです(笑)
あぁそういえば、まさかPS4のゲームの中で初代PSのゲームができるとは思ってもみませんでした!あの初代PSのゲームのCMの歌、今でも耳に残ってます。どういうゲームだったのかは今回初めて知ったんですけど。


さて、4月でしたか、「build2016」にて、Microsoft社がBot開発用フレームワーク、「Microsoft Bot Framework」を公開しました。
このフレームワーク、C#はもとより、Node.jsでBotの制御ができ、skypeやSNS、Slackに対応、はたまたWebでも公開できて、RestAPI化もできるということですので、じゃあちょっとPepperと繋いでみようかということでやってみました。

あ、ちなみに、環境はMacです。Windowsではありません。
Mac環境でNode.jsで構築したBotをAzure上にWebAPPとしてデプロイします。デプロイは、git経由でやればいいかなと思います。

まずは環境の設定と、Microsoft Bot Frameworkの登録です。

Microsoft Bot Frameworkを使えるようにするためには、「https://dev.botframework.com/
にアクセスし、必要事項を記載し「Register a bot」をクリックします。
ただ、そこに至るまでにAzure上でWebAPP環境を構築する必要があります。ちょっとそこまで言及しちゃうと、それだけで記事が2本くらい書けちゃいそうな気がするので・・・今回はすみません割愛します。

ただ、Web上にいろんな情報がありますし、Microsoft Bot Frameworkのドキュメントにももろもろやり方が記載されていますので、そこを参照されれば大丈夫だと思います。

さて、環境が整ったら早速Botを作っていきましょう。

まずは手始めに、シンプルに何か表示させるBotです。

まずは、server.jsにこんな感じのコードを記載します。

serverjs

次に、Botをブラウザ上に表示させるための仕組みを用意します。
Microsoft Bot Frameworkの「My bots」内に、先ほど作ったBotの詳細が表示されると思います。
その中の、画面右側「Channels」に「Web Chat」があるかと思います。この、「Web Chat」の「Edit」をクリックすると、多分こんな画面がでてきます。

chatset

「Web Chat secret」をクリックすると、HTMLタグとSecretが表示されます。

idsecret

この二つをコピーしておきましょう。それから、「Enable this bot on Web Chat」にチェックを入れるのを忘れずに・・・

続いてHTMLファイルです。今は、Azure上に構築したWebAPP環境の中にindex.htmlファイルをデプロイし、Node.jsがこのindex.htmlを呼び出してあげるような作りにしています。このindex.htmlに、先ほどコピーしたタグを貼り付けてあげます。

htmlcode

server.js、index.htmlをAzure環境にデプロイし、取得したURLにアクセスすると、アクセス先のWebページ内にBotが表示されるようになります。

bot

ひとまず、これでできあがりです。Botに何か文字を入力してみます。

firstInput

答えが返ってきました!が、これだとただの入出力を入れただけのプログラムと一緒ですよね・・・
なので、受け答えができるようにします。

Documentでも説明があるのですが、ユーザに質問を投げかけ、その結果を返して次に遷移していく「ウォーターフォール型」と呼ばれる作りを作成します。「bot.add()」に、配列型で次々に処理を並べていきます。

waterflowCode

さっそくAzure上にデプロイ・・・の前に、ちょっとローカルでテストをしてみましょうか。
Windows環境ではテスト用エミュレータが用意されていて、Bot Frameworkのドキュメントでも結構詳しく説明してあるんですが、この記事では残念ながらMac環境なのでMacで動くエミュレータを使います。

https://docs.botframework.com/en-us/tools/bot-framework-emulator/

Microsoft提供サービスだけあって、ここの一番下に申し訳程度にサラッと書いてあるんですが、「Console Emulator」と「Mono」を用意し、「Console Emulator」は展開、「Mono」はインストールします。

続いて、コンソールからConsole Emulatorこと「BFEmulator」のフォルダへ移動し、「mono BFEmulator.exe」と打ち込めばエミュレータが起動します。

 

bfemu_set

「/settings」でEndpoint、AppId、AppSecretの設定ができます。適時編集してください。ちなみん、Endpointはローカル上なので

  • 「http://localhost:server.jsで指定しているポート番号/api/messages」

でイケると思います。

Endpoint、AppId、AppSecretが適切に設定されていれば、コンソール上でBotのテストができます。ほら、こんな感じに。

emu

エミュレータ上で起動するのを確認したら、Azureにデプロイしてブラウザで表示し、動かしてみましょう!

waterFlowBot

動いた!!なんかBotっぽい!

というわけで、これでBotのできあがりなのですが、これでもまだ物足りません。だって、日本語って一つの言葉に対していろんな言い回しがあるじゃないですか。

例えば、「2016年6月7日って何曜日?」という質問があったとして、日本語でいう場合は「2016年6月7日って何曜日だっけ?」とか、「何曜日かしら?」とか、はたまた「何曜日だっけよ?」とか「何曜日だったっけね?」とかいろんな言い方があるじゃないですか。

そこで、Microsoft社の提供している人工知能「LUIS」の出番となるわけです。

というわけで、次回はLUISを使ってBotと人工知能をつなげて、なおかつ、本題であるBotとPepperをつなげるところまでを紹介します!!お楽しみにー!!

ちなみに、ここら辺を参考にしながら作っています。

http://qiita.com/o0h/items/6e0f7a705f7162a49394

http://www.atmarkit.co.jp/ait/articles/1604/15/news032.html

http://www.atmarkit.co.jp/ait/articles/1604/26/news032.html

あ、そういや今回Pepper君出番なし・・・

なんで、サミット期間中から三重県は鳥羽市観光協会にて一生懸命働いてたPepper君の写真を最後に!それではまた!

toba

「三重県について、僕が紹介します!」


コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です