この資料はobniz x LINE Thingsのハンズオンを行ったときの資料です
作るもの
LINE Things名物、無限PUSH通知
こちらを構築してみましょう
作成の流れ
- 事前チェック
- LINE BOTを作成する
- LINE Thingsとしてつなげる
事前チェック
obnizのfirmwareとLINEアプリを最新のものにアップデートしてください
下記で動作確認をしています。
| アプリ | バージョン | 確認方法 |
|---|---|---|
| obniz firmware | v1.1.0 |
https://poche.xsrv.jp/iot-gym/2019/02/25/obniz-firmware-version-and-mac-address/ 上記URLの通りにやってDisplayInfoが確認できない場合は、firmwareバージョンが古いのでアップデートが必要です |
| LINE | v9.8.0 | https://digitalnews365.com/check-line-version |
LINE BOTを作成する
サーバーを立てて、その後LINEの設定をしていきます。
サーバー立ち上げ
予めプロジェクトを作っておきましたので、これをコピーしてサーバーを立ち上げます。
こちらにアクセスします。
https://repl.it/@9wick/line-things-handson
上のフォークボタンを押してプロジェクトをコピーします
左のファイル一覧で.envファイルを作成し、.env.exampleの内容をコピーします
右側の"Hello LINE BOT!"と書かれているタブを消します。
runボタンを押して実行します。再度"Hello LINE BOT!"が出てくればサーバーの立ち上げ完了です。
"Hello LINE BOT!"の上のバーに出ているURLが立ち上げたサーバーのURLです
プログラムのエンドポイントは次のようになっています
- 確認用トップページ GET https://xxxxxx.repl.co/
- LINEからのWebhook受付 POST https://xxxxxx.repl.co/webhook
- LIFFアプリ用URL GET https://xxxxxx.repl.co/liff
LINEのbot立ち上げ
LINE DevelopersへLINEアカウントでログインします。
LINEアカウントでのログインにはID/Passwordが必要です。まだない人は、スマホのLINEアプリで登録することができます。
プロバイダーを選びます。必要に応じて新規作成して下さい
新規チャネルを作成します。
プロバイダーを新規作成した場合はこの画面ではなく、次のチャネル種類選択画面が出ていますので、ここはスキップします。
MessagingAPIで新規Botを作成します。
新規チャネルでの入力項目は下記のとおりです
・アプリ名 (LINEの文字を入れると弾かれます)
・大業種
・小業種
・メールアドレス
問題なければ規約にチェックして次へ進みます。
作ったBotが出てきていますので、そちらに入ります。
チャネルシークレットをrepl.itの.envファイルに記載します。
下の方でアクセストークン（ロングターム）を発行します
発行したアクセストークンをrepl.itの.envファイルに記載します。記載が終わったらrestartボタンを押してサーバーを再起動させておきましょう。
Webhook送信を"利用する"に設定します。
WebhookURLを立ち上げサーバーのURL + "/webhook"にします
https://xxxxxx.repl.co/webhook
https://はもうすでに左側に書かれていますので、xxxxxx.repl.co/webhook の部分だけ記入します。
LINE自動応答のメッセージの「設定はこちら」から、設定を変更します。
* あいさつメッセージをオフに
* 応答メッセージをオフに
* webhookをONに
これでLINEの設定も完了です。
LINEで友達登録してなにか送ってみましょう
LINE Thingsとしてつなげる
LINE ThingsにはLIFFアプリが必須なので、LIFFアプリを作りその後自動応答のためにシナリオを作ります。
LIFFアプリ設定
LIFFタブから新規LIFFアプリを作成します。
設定でBLEをONにするのを忘れずに行います。
エンドポイントは立ち上げたサーバーのURL + "/liff"にします
https://xxxxxx.repl.co/liff
これで無事作成完了です。
シナリオ設定は @n0bisuke さんが作っているアプリを使って設定します
( @n0bisukeさんありがとうございます)
https://n0bisuke.github.io/linethingsgen/
まずはSettingに行って、アクセストークン（ロングターム）を入力して保存します。
Create Productに戻って少し待つと、先程作ったLIFFアプリが出てくるので選択します。プロダクト名を入力して作成ボタンを押すと、下に緑色で結果が表示されます。
このとき、プロダクト名はユニークな名前にして下さい。他人とかぶるとどれが自分のデバイスかわからなくなります。
そのままCreate Scenarioへ行きます。先程作ったproductが選べますので、選択します。
トリガーがBLE_NOTIFICATIONになってるのを確認してシナリオセットを登録します。
シナリオセットの登録時に出てきたBLE_NOTIFICATIONのserviceUuidとcharacterisitcUuidを.envファイルに記載します。ついでに自分の持っているobniz_idも入力します。
repl.itのrestartボタンを押して反映させましょう
obnizに"Obniz Ready"と表示されていればうまく動いています。
試してみる
こちらのQRからLINE Thingsを有効化します
LINE Thingsの画面で自分の作ったproductを選んでペアリングします
ペアリングがうまくできない場合は、Bluetoothのオンオフ、端末の再起動を試して下さい。
連携できれば完了です。
obnizが自動的に接続され、connected表示になります。
まずはLIFFでLINE Thingsを触ってみましょう。
マイデバイスで選択します。場合によっては認証を求められるので、よく読んで許可しましょう。
LIFFが立ち上がります。
obnizのスイッチを押すとLIFF上でボタンが押されたり、
LIFF上のスイッチを押すとobnizのディスプレイの表示が変わったりします。
LIFFで十分に遊んだたら、LIFFを閉じます。
その状態で左上のスイッチを押すとLINEを経由してサーバーに通知が行き、replyにてbotがチャットします。
これでLINE ThingsのLIFFとが体験できました！