LINE BOT ノードでオウム返し LINE BOT をつくってみる

4d420ccaf6cad0706f056f177c3c86c6

LINE BOT ノードでオウム返し LINE BOT をつくってみます。

7dc340b3f7321e8dce59947cb3e82d50

このようなフローを作ります。

フローのタブを追加して今回のフローをはじめる

今回のフローは新しいタブで進めましょう。

bfacbb2d76a7dd13d00cde6b970fb7d5

こちらの+ボタンからフローのタブを作成します。新しくできたフローのタブで作業をはじめましょう。

作成したBOTのチャンネルシークレットとチャンネルアクセストークンを準備

fec310ce30185a693f6e30be33779d79

LINE Develipers https://developers.line.biz/console にログインして、作成したBOTのチャンネルシークレットとチャンネルアクセストークンを準備します。

  • 作成した BOT にアクセス
  • チャネル基本設定を選択してチャネルシークレットをコピーして準備
  • Messaging API 設定を選択してチャンネルアクセストークンをコピーして準備

node-red-contrib-line-messaging-api のインストール

LINE Messagin API を利用できる Node-RED のノード node-red-contrib-line-messaging-api を使います。

右のメニューから メニュー > パレットの管理 を表示して、ノードの追加タブをクリックしてノード追加画面に移動します。

0ce468bb98cf21d85df9b8ae915fabfd

node-red-contrib-line-messaging-api で検索してノードを追加ボタンをクリックしてノードをインストールします。

c7e9b9e7151582019e51c8316cdef4d4

パレットにノードが追加されました。

フローを作る

710bca68444a4b81197191017afe4c8d

LINE ノードのカテゴリで Webhook ノードを配置します。これは Node.js のプログラムの時の、LINE Messaging のデータが入ってくる入り口の役割です。

a6a64c590dc3dbdaecb2288e5d00a0ef

Reply ノードを Webhook ノードの横に配置します。

aeb536a5fc5fc0be0346bee082dafd9a

Reply ノードと Webhook ノードをつなぎます。

Webhook ノードの設定

8161026e887bc2315168e07b06343a86

/webhook を窓口にするよう設定します。Webhook ノードをダブルクリックしてプロパティを表示します。

615890f590aced84a1587e42388c47e9

/webhook と入力して完了ボタンをクリックします。

Reply ノードの設定

作成したBOTのチャンネルシークレットとチャンネルアクセストークンを設定します。

9f5c67592af9be3bd624480456fe8501

Reply ノードをダブルクリックしてプロパティを表示します。

image.png (12.6 kB)

/webhook と入力して完了ボタンをクリックします。

615890f590aced84a1587e42388c47e9

Sercret には チャンネルシークレット、AccessToken にはチャンネルアクセストークンを反映して完了ボタンをクリックします。

デプロイ

19e98ad3d0ad7297e36ad4c035cb36c4

デプロイします。

サーバー公開

これで enebular による LINE BOT サーバーができました。

今回は、この一時的に使っているエディタそのもののサーバー URL で試してみます。

8355eb99ba9f5b82bf84301dbb7574ae

右上の i というアイコンをクリックします。

31d22a4c38d78b46dc9d6623573f5136

URL をテキスト選択してコピーします。

Webhook URL の更新

LINE Developers で、今回使っている BOT の Messaging API 設定に移動します。

image

Webhook URL の項目に移動して以下の手順を行います。

さきほどの URL に /webhook をつけて反映

image

さきほどコピーした URL https://**********.herokuapp.com//webhook をつけて Webhook URL の項目に入力して更新ボタンをクリックします。

image

Webhook の利用がオンになっていることも確認しましょう。

動かしてみる

4d420ccaf6cad0706f056f177c3c86c6

LINE BOT にメッセージを送ってオウム返しを試してみましょう。

エクストラ

  • このままの仕組みだとエディタが生きている時しか動かないので、ずっと動かしたいときは永続的な仕組み(クラウド実行環境)を導入します

次は

左のメニューから、次に進みましょう。

results matching ""

    No results matching ""