ノンコーディングで話しかけると天気を教えてくれるLINE BOTを作ってみた話。(LINE BOTとLogic Appsの連携)

Pocket

line-weather-ttl
Logic Appsのコネクターを眺めていたら「MSN Weather」というコネクターを見つけまして。
既存の天気予報サービスは色々ありますが、「天気を聞いたら答えるBOTを自分で作れたら面白いかも?しかも天気知りたいときってスマホで知りたいかも」と個人的に思いまして、今回はLogic Appsを使ってLINE BOTをノンコーディングで作れるか試してみました。
結論からいうと若干JSONをいじる必要はありますが、ツールをうまく使えば自力でコーディングせずLINE BOTを作ることは可能!(ちなみに私はプログラム知識はほぼありません)
今回の仕組みを作るにあたり、@twit_ahf さんの資料「CLRH_20161217」をがっつり参考にさせていただきました!ありがとうございます!m(_ _)m

ということで、LINE BOT × Logic Appsで「天気を答えるBOT」作成を試した手順メモはこちら。

今回やること

ざっくり説明図はこちら。
line-weather001
LINE BOTに話しかけると、話しかけた内容によってLogic Apps経由で以下の結果をLINEに返します。

  • 明日の天気(天気と降水確率、カサがいるかどうか?)
  • 今日の天気
  • (天気が含まれない会話のときは)話しかけてほしい文言を表示

天気に関する処理はLogic Apps側のコネクターで行います。
ちなみに「カサがいるかどうか?」の判定基準は私基準で「降水確率50%以上」と勝手に決めましたー。(このあたりはお好みで)

LINE側の事前準備

今回はLINEの「Messaging API」を利用するので、まずはLINE Business Centerでアカウントを作っておきましょう。(開発者用の無償プラン「Developer Trial」で)
説明に従っていけば登録出来ると思うので、登録方法については割愛します。

line-weather002
アカウントができたら「LINE@MANAGER」に移動。

line-weather003
アカウント設定 > BOT設定アカウントの API を有効化してWebhook を「利用する」に設定変更します。一部機能が使えなくなるよ?という警告が出ますが、このあたりは自己責任で。
この部分の設定変更ができてないと、そもそもBOTが動かないので地味にハマります…(実際ハマった)
また、この画面で「自動応答メッセージ」のデフォルト設定も「利用しない」にしておくのをオススメします。

実際に仕組みを作ってみる

Logic Appsの全体図はこんな感じ。
line-weather004
使っているのはトリガーが「要求」・コネクターは「MSN Weather」「HTTP」と使っている種類は少ないのですが、分岐が結構出てきますので番号ごとに説明します。

そして、今回はLINEの「Messaging API」を使うのですけど、リファレンスが用意されているのでそちらを使います。


ここに書かれてある内容を利用して、コピペしていきます。

1:トリガー「要求」の作成

line-weather005
以下のサイトを利用して必要なスキーマーを作成します。

JSON の値からスキーマを作ってくれるサービス
http://jsonschema.net

line-weather006
API Referenceの「Webhook Event Object」の内容を「Text」の内容に変更してからjson schemaの左側の枠にコピペ。
json schemaの右側の枠内に表示されたコードをLogic Appsの「要求本文の JSON スキーマ」にコピペ。
「この URL に HTTP POST」はこのLogic Appsを保存したら表示されます。

2:文言の判定(「天気」という単語が含まれるか?)

line-weather007
会話内に「天気」という単語が含まれる・含まれないで処理を分岐させています。

▼「はい」の場合
今日の天気か明日の天気かの判定をさせます。(3の説明)

▼「いいえ」の場合
line-weather010
話しかけた文言に「天気」という単語が含ない場合は、指定の文言を聞くよう返答します。(赤枠部分)
ヘッダー、本文の記入内容は「3」で説明します。

3:今日の天気か明日の天気か判定する

文言の内容が「明日」を含むなら「はい」へ、含まなければ「いいえ」の処理を行います。

▼「はい」の場合:明日の天気
line-weather008
コネクターで「Weather」を検索して、明日の天気を取ってくる「Get the forecast for tomorrow」を選択。
今回、Locationは「Kitakyusyu,Japan」と指定してみます。
「条件3」については「4」で説明します。

▼「いいえ」の場合:今日の天気
line-weather009
今日の天気を取ってくる「Get the forecast for today」を選択。
HTTPコネクターにAPI Referenceの「Push Message」の内容をヘッダー・本文の部分に記載します。(JSON形式に直します)
ヘッダー部に含まれる「Bearer {Channel Access Token}」は「LINE developers」に表示されている「Channel Access Token」ですので確認してください。
その上の「Webhook URL」には、トリガー「要求」のURLを入力します。
また、本文に含まれる「TO」は「送信先識別子」。これは LINEのIDでは無く「U」からはじまる文字列です。
この「送信先識別子」がはじめわからず、Logic Appsの結果(JSON形式)を眺めていたら中にuserIdというのを見つけ、これが「送信先識別子」と突き止めました。わかりにくいw
text部分では、MSN Weatherコネクターの内容を動的に表示するようにしています。(Conditionsのところ)

4:降水確率でカサがいるかどうか判定する

line-weather011
「Rain Chance」を使って降水確率を判定してみます。個人的に50%以上はカサがいるかなと。

line-weather012
「はい」の場合は、天気と降水確率を表示。
「いいえ」の場合は天気を動的に表示するようにしています。

LINEではどう表示されるか

では実際にBotに話しかけてみたらどうなるか?はこちら。
line-weather013
このような形で、キチンと指定した通りにLogic Apps側から返答を返しています。

天気の結果はあってる?

line-weather014
「ロジックアプリの実行」でLocationとMSNの天気のページへのURLが確認できます。

line-weather015
上記のLINE BOTの返答と赤枠内を見比べてみると、一応あってるみたいですw

最後に

今回作ったBOTはホントに自分用なので、地域は固定・BOTに友達登録してもらってもうまく返信できないという問題点があったり…(汗)
このあたり、知識がほぼない状態が祟ってうまく調整できていないので、これをキッカケに勉強してみたいなと思ってます。
「もっとこうした方がいいよ!」とかの意見もお待ちしておりますw

実際はコーディングした方が早いのでしょうけど、私のようにプログラム書けないよ!って人でも、こんな感じで他のサービスを使ったBOTも作れるのでLogic Appsはすごくおもしろいと思います。
是非試してみてください♪

Pocket

コメントを残す

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

次のHTML タグと属性が使えます: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>