見出し画像

Node-REDをつかってLINEからBOCCOをしゃべらせてみる

こんにちは、エンジニアのたくろーどんです。

BOCCOを手に入れてから、BOCCO APIをつかってBOCCOを喋らせることに夢中になっています(一番最後に記事一覧をまとめます)。

次は何からBOCCOを発話させてみましょうか...?
うーん、特に理由はありませんが、普段使うメッセンジャーアプリ「LINE」からBOCCOを発話させてみることにしましょう。

LINEには便利なAPIが用意されているので、それを組み合わせれば良さそうです。

動作風景

このような感じで動作します。

しくみ

LINE側ではLINE Messanging APIを利用し、LINEのルームから送信されたテキストを取得します。そして、そのテキストをBOCCO APIに渡してPOSTすることで発話させます。

上記の仕組みをNode-RED上でデプロイすることで動かし続けます。

Node-REDとは...
ハードウェア・デバイス、API、Webサービスなどをつなぐためのオープンソース・ソフトウェアです。極力コーディング作業を減らし、プログラミングに必要な処理をNodeという箱で用意しておき、それをフローとして組み立てることでアプリケーションの処理が完成します。実態はサーバーサイドJavaScriptのNode.jsで作られています。- IBM Cloud Blogより引用

画像1

つくりかた

Node-REDでLINE messaging APIを試すやり方はこちらを参考にしました。

enebularでLINE Messaging APIを試してみる
Node-REDはローカルに環境構築しても良いですが、enebularというサビース上のNode-REDを使用するとセットアップする手間が省けます。また、enebular上でデプロイするとセッション時間はきまっていますが、ランダムなURLでherokuにデプロイされます。ちょっとした動作確認には便利です。もちろん、自分自身のAWSやherokuへデプロイすることもできます。長期間使うことを想定するなら後者でデプロイすると良いでしょう。

1.enebular上でプロジェクトを作成
2. LINE Developerの設定

上記の説明はこちらをガッツリ参考にしました。
Webhookを使います。

3.BOCCOを発話させるためのフローをつくる

Node-RED上でBOCCOを発話させるためのフローの詳細はこちらを確認してください。

上記とこちらの内容を組み合わせるイメージです。Node-REDのフロー完成図は下記の通りです。
肝は、下記画像にある「move msg.payload.events[0].message.text」部分です。

画像2

LINEで入力された文字列は「msg.payload.events[0].message.text」に格納されています。それをBOCCO APIでPOSTするのに必要な形「msg.payload.text」に変更しています。これはBOCCO APIのcurlコマンドの仕様を確認すれば明らかです。

画像3

上記のNode-REDのフローを書きに示します。
アクセストークンやルームIDはご自身のものを使用してください。

[{"id":"451fcd79.ef5f84","type":"tab","label":"フロー 1","disabled":false,"info":""},{"id":"a4eab0aa.171e4","type":"http in","z":"451fcd79.ef5f84","name":"Webhooks","url":"/line","method":"post","upload":false,"swaggerDoc":"","x":80,"y":160,"wires":[["8bdf495b.7c0838","2309b075.fe89c"]]},{"id":"8bdf495b.7c0838","type":"function","z":"451fcd79.ef5f84","name":"getText","func":"\nreturn msg;","outputs":1,"noerr":0,"x":180,"y":320,"wires":[["15d22276.b9c64e","f78a54d3.175798","6b776264.40390c"]]},{"id":"15d22276.b9c64e","type":"debug","z":"451fcd79.ef5f84","name":"","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"payload.events[0].message.text","targetType":"msg","x":490,"y":260,"wires":[]},{"id":"f78a54d3.175798","type":"http response","z":"451fcd79.ef5f84","name":"","statusCode":"","headers":{},"x":390,"y":320,"wires":[]},{"id":"2309b075.fe89c","type":"debug","z":"451fcd79.ef5f84","name":"","active":true,"console":"false","complete":"false","x":330,"y":160,"wires":[]},{"id":"187dd487.373f2b","type":"change","z":"451fcd79.ef5f84","name":"curl -H 部分(ヘッダー)","rules":[{"t":"set","p":"headers.Accept-Language","pt":"msg","to":"ja","tot":"str"},{"t":"set","p":"headers.Content-Type","pt":"msg","to":"application/x-www-form-urlencoded","tot":"str"}],"action":"","property":"","from":"","to":"","reg":false,"x":450,"y":600,"wires":[["a38d4732.4eefa8","4bee9b14.79d674"]]},{"id":"a38d4732.4eefa8","type":"http request","z":"451fcd79.ef5f84","name":"","method":"POST","ret":"txt","paytoqs":true,"url":"https://api.bocco.me/alpha/rooms/xxxxxxxxxxx/messages","tls":"","persist":false,"proxy":"","authType":"","x":730,"y":600,"wires":[["61815fb5.81a24"]]},{"id":"61815fb5.81a24","type":"debug","z":"451fcd79.ef5f84","name":"","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"false","x":850,"y":600,"wires":[]},{"id":"4bee9b14.79d674","type":"debug","z":"451fcd79.ef5f84","name":"","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"false","x":710,"y":640,"wires":[]},{"id":"b1501136.ce315","type":"comment","z":"451fcd79.ef5f84","name":"注意点を記載しています","info":"herokuへのデプロイによるセッションは時間制限があるた、1時間ごとにURLがかわる。\nよって、LINEコンソール上のwebhookのURLもそれに伴い変更する必要がある。\nそれを防ぐためには、自分のherokuアカウントへデプロイする必要がある。","x":150,"y":40,"wires":[]},{"id":"8e4f82ea.549bf","type":"uuid","z":"451fcd79.ef5f84","uuidVersion":"v4","namespaceType":"","namespace":"","namespaceCustom":"","name":"payload.unique_id に uuid を付与","field":"payload.unique_id","fieldType":"msg","x":780,"y":460,"wires":[["167d9d54.b8ecc3"]]},{"id":"d4ed15d8.104628","type":"debug","z":"451fcd79.ef5f84","name":"","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"payload.text","targetType":"msg","x":430,"y":400,"wires":[]},{"id":"6b776264.40390c","type":"change","z":"451fcd79.ef5f84","name":"","rules":[{"t":"move","p":"payload.events[0].message.text","pt":"msg","to":"payload.text","tot":"msg"}],"action":"","property":"","from":"","to":"","reg":false,"x":270,"y":480,"wires":[["d4ed15d8.104628","8e4f82ea.549bf"]]},{"id":"167d9d54.b8ecc3","type":"change","z":"451fcd79.ef5f84","name":"curl -d 部分","rules":[{"t":"set","p":"payload.access_token","pt":"msg","to":"xxxxxxxxxxx","tot":"str"},{"t":"set","p":"payload.media","pt":"msg","to":"text","tot":"str"}],"action":"","property":"","from":"","to":"","reg":false,"x":770,"y":500,"wires":[["187dd487.373f2b"]]}]

おわり

駆け足で、LINE messaging APIとBOCCO APIをNode-RED上でつなげてBOCCOを発話させてみました。ただし長期的に運用する場合はenebular外のサービスへデプロイしましょう。

BOCCO APIといろんな技術を組み合わせられると楽しそうですね。是非、試してみて使い道を見つけてください!

記事一覧

画像4


この記事が気に入ったら、サポートをしてみませんか?
気軽にクリエイターの支援と、記事のオススメができます!
お出かけ前もBOCCOが声かけ!
11
『ロボティクスで、世界をユカイに。』 ユカイメンバーがユカイ工学の内側をゆるっとお届けします!(アイコンはQoobo広報担当「くぅ坊」) ○ストア:https://store.ux-xu.com/ ○教育事業:kurikit(https://note.com/kurikit