読者です 読者をやめる 読者になる 読者になる

生産性向上ブログ@miyajan

圧倒的生産性向上を目指すエンジニアのためのブログ

LINE Developer DayでもらったBeacon(ビーコン)を試してみた

linedevday.linecorp.com

2016/09/29に開催されたLINE Developer Dayに参加してきたのだけど、そこでおみやげにビーコンをもらった。参加費無料なのにすごすぎる!

f:id:miya-jan:20161002023250j:plainf:id:miya-jan:20161002023305j:plain

こんな感じで表は基盤むき出し、裏は乾電池むき出しのいけてるやつ。今回は、これを動かしてみたのでまとめてみる。

LINE Botの設定

まずは、LINE Botを登録する必要がある。

business.line.me

まずは、LINE Business Centerでアカウントを作成して、Developer Trialに登録。Developer Trialは、Messaging APIのページ(https://business.line.me/ja/companies/<アカウントID>/services/bot)から作成できる。

Developer TrialはBotを作るために使うMessaging APIのプランの一つ。フリープランと違って、Push API(Bot起点のメッセージを投げるためのAPI)が使える。今回はビーコンの近くに来たときに発火するイベントに対してReply APIでメッセージを送るだけなので、Push APIは使わないけど。

Trialを開始したら、LINE Manager→アカウント選択→アカウント設定→Bot設定を開く。

f:id:miya-jan:20161001171349p:plain

こんな感じの画面が表示されるので、"APIを利用する"を選択する。

Bot設定で、Webhook送信を"利用する"にする。

ビーコン端末の設定

次は、ビーコン端末を登録する。ビーコンが入っていた箱にURLが書いてあるのでそこにアクセスして、ビーコンと紐付けるアカウントを選択する。

すると、端末IDとパスコードを要求されるけど、これがなんのことかわかりづらい。ビーコンの電池を外したところに"HWID"と"CODE"が書いてあるので、それぞれ端末IDとパスコードに入力する。

これで無事に連携が完了する。

スマートフォンとLINEアプリの設定

f:id:miya-jan:20161001174925p:plain

LINE Beacon→アカウント連携の画面を見ると上の画像のような設定をしろと書いてあるので、スマートフォンとLINEアプリを設定しておく。

LINE Botを友達に追加するには、アカウント設定→基本設定に表示されるQRコードを読み込むのが手っ取り早い。Botアカウントと友達にならないとビーコンに近寄ってもメッセージが飛ばないので、勝手に見知らぬ他人にメッセージが送られる心配はしなくていい。

Webhookの設定

ビーコンに近づいたときにリクエストが投げられるWebhook先を実装しないといけない。

Webhook先はhttpsでないといけないようで、Bot APIのtrial時のドキュメントによるとオレオレ証明書はダメっぽい(未検証)。そうなるとローカルでは試しづらいので、AWSのAPI GatewayとLambdaを組み合わせてサクッと作ってみる。

API Gateway

f:id:miya-jan:20161002024956p:plain

まずは、新規にAPIを作成する。API名は適当に。

f:id:miya-jan:20161002025017p:plain

WebhookはPOSTでリクエストが飛んでくるのでPOSTにメソッドを作成する。このとき、Lambdaを指定してメソッドを作成する。Lambdaの関数はあとで実装するので、とりあえずはデフォルトのままでOK。

f:id:miya-jan:20161002025028p:plain

作成できたら、APIをデプロイする。これだけでhttpsのAPI受け口が簡単に作成できてしまうので、すごいお手軽。

注意点としては、これはあくまで実験用なのでセキュリティとかなにも考えていない。実験に使ったらすぐに捨てる。まじめにやるなら、ドキュメントに書かれているとおり、"X-Line-Signature"を使って署名を検証しないと関係ない第三者にAPIを叩かれるリスクがあるので注意。

Webhook URLの設定とChannel Access Token発行

f:id:miya-jan:20161002025149p:plain

Webhook先URLの設定がどこからできるのか分かりづらかったけど、LINE Business Centerのアカウントリストでアカウントの"LINE Developers"を選択するとチャンネルの設定画面が開く。

Webhook URLにAPI Gatewayのステージに表示されるURLを指定して保存する。Channel Access TokenはLambdaの関数内で使うのでISSUEしておく。

Lambda

API Gatewayに設定したLambdaの実装をちゃんと書く。今回は、node.jsで以下のように書いた。

var https = require('https');

exports.handler = (event, context, callback) => {
    var requestBody = JSON.parse(event['body']);
    var events = requestBody['events'];
    for (var i = 0; i < events.length; i++) {
        var eventType = events[i]['type'];
        if (eventType === 'beacon') {
            var replyToken = events[i]['replyToken'];
            var data = JSON.stringify({
                replyToken: replyToken,
                messages: [
                    {
                        type: 'text',
                        text: 'まちのそとにでて あるきつづけるとやがて よるになりましょう。'
                    }
                ]
            });
            var channelAccessToken = <先ほど発行したChannel Access Token>;
            var headers = {
                'Content-Type': 'application/json',
                'Content-Length': Buffer.byteLength(data),
                'Authorization': 'Bearer ' + channelAccessToken
            }
            var options = {
                hostname: 'api.line.me',
                path: '/v2/bot/message/reply',
                method: 'POST',
                headers: headers
            };
            var req = https.request(options, function(res) {
                var data = '';
                res.on('data', function(chunk) {
                    data += chunk;
                });
                res.on('end', function() {
                    console.log(data);
                    var responseCode = 200;
                    var body = 'Success!'
                    var response = {
                        statusCode: responseCode,
                        body: JSON.stringify(body)
                    }
                    context.succeed(response);
                });
            });
            req.write(data);
            req.end();
        }
    }
};

本当は複数イベント飛んでくる可能性を考えてもっとちゃんと書かないといけないのかもだけど、今回は実験目的なのでこれぐらいで。

動作確認

ビーコンの電源をONにするとランプが30秒ほど点滅して消える。どうやら、ランプが消えたらもう動いてるっぽい。正直わかりにくい。

さらに、イベントがなかなか発火しなくてハマった。いろいろ試した結果、スマホ側のBluetoothのオンオフを何回か切り替えていたらようやくメッセージが飛んできた。

f:id:miya-jan:20161002023553p:plain

やったー!村人っぽい!

まとめ

どうにかこうにかLINE Beaconを動かすことができた。AWSのAPI GatewayとLambdaを使うと、無料利用枠の範囲で試せるのでおすすめ。

一方で、イベント発火のデバッグはかなり辛かった。電池切れを疑って無駄に新しい電池を買ってきたりしたけど、関係なかった。イベントが発火するかどうかは運なので、確実性が求められる用途では使いづらいと感じた。

とはいえ、無料でここまで動かせる環境を整えてくれたLINEさんはやっぱりすごいとしか言えない。LINE Developer Day自体もとても質の高いイベントだったし、開発者の一人としてLINEさんのイメージはとても上がった。今後もAPIやビーコンのうまい活用方法を思いついたら積極的に試していきたい。