やりたいこと
最終的には、LINE Botから画像を送り、Node-REDを介して、TeachableMachineで判定させ、LINE Botに判定結果を送信する。
というところまでやりたいですが、この記事ではLINE Botに送った画像をNode-REDで表示するというところまでやります。
前提
この記事では以下のことは完了している前提です
- LINE Botの作成
- Node-REDの環境構築
手順
-
パレットの管理で「node-red-contrib-image-output」、「Node-REDのnode-red-contrib-line-messaging-api」のノードを追加します
-
パレットから、LINEの「webhook」、機能の「template」、ネットワークの「http request」、出力の「image」をパレットに展開しつなぎます
-
webhookの設定をします
path, name ともに何でもいいですが、のちほどLINE Developerに登録する際に必要なので、よくわからない場合は、webhookにしておきましょう。
-
templateの設定をします
-
http requestの設定をします
URLには以下を入力
https://api-data.line.me/v2/bot/message/{{{messageId}}}/content
LINE DevelopersのLINEBotの設定画面からチャンネルアクセストークンをコピーし、トークンに貼り付ける
LINE DevelopersのWebhookURLを変更も設定が必要です。
なんらかのホスティングサービス等を使ってNode-REDをインターネット上に公開していると思うので、
そのURLに、LINEの「webhook」ノードで設定した「/webhook」を末尾につけLINEBotのwebhookURLを更新します。
現在のNode-REDを表示しているページのURLが「https://node-red-test-xxx.xxxxxxxx.com/#flow/123456789」 という形であれば、 「https://node-red-test-xxx.xxxxxxxx.com」 の部分に、「/webhook」を付けて、「https://node-red-test-xxx.xxxxxxxx.com/webhook 」 という形式
URL内の{{{messageID}}}の{}は3つなので注意してください・
次に認証を使用にチェックを入れ、種別はBearer認証を選びます。トークンには事前に用意したLINE botのチャネルアクセストークンを貼り付けます。
最後に出力形式はバイナリバッファを選択します。
以上でLINE画像の送付準備は完了です。
解説
ゴニョゴニョなにやってるの？
LINE Botから送られてきた情報を「webhook」で受け取り、
「template」でその中からメッセージIDを取り出し、
「http request」でメッセージIDに紐づくデータを取得し、
取得できたかの確認のため「image preview」で表示
ということをやっています。
なんでLINEBotから送られた情報の中に画像のデータがないの？
おそらくですが、毎回毎回画像データごと送っていては大変だからでしょうか。
もし必要だったら、以下のAPIを利用して、改めて画像をゲットしにいく仕様になっています。
https://api-data.line.me/v2/bot/message/{{{messageId}}}/content