【Node.js】LINE Messaging APIのURLスキームを使ってメンヘラ彼女BOTを実装する


## カメラや位置情報を実行させるURLスキーム

昨日（11月27日）LINEからMessaging APIの新機能URLスキームが公開されました。

<blockquote class="twitter-tweet" data-lang="ja"><p lang="ja" dir="ltr">LINEのトーク画面から1タップで位置情報やカメラを起動するなど、特定のコンテンツを開いたり特定の動作を実行させるURLスキームを公開しました！テンプレートのボタンやリッチメニューに紐付ける等すると更にBOTが便利になりますので是非ご利用ください。<a href="https://twitter.com/hashtag/LINE_API?src=hash&amp;ref_src=twsrc%5Etfw">#LINE_API</a> <a href="https://t.co/eztzf5sRsq">https://t.co/eztzf5sRsq</a> <a href="https://t.co/HmNmB2CmLe">pic.twitter.com/HmNmB2CmLe</a></p>&mdash; LINE_DEV (@LINE_DEV) <a href="https://twitter.com/LINE_DEV/status/935329685210148865?ref_src=twsrc%5Etfw">2017年11月28日</a></blockquote>
<script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>

正確にはLINEにはもともとあった機能ですが、開発向けに仕様が公開されました。

## できること
カメラを開く、位置情報画面を開く、スタンプショップを開く、、などなどLINEアプリのさまざまなコンテンツを開くことができます。

![スクリーンショット 2017-11-29 1.40.09.png](https://qiita-image-store.s3.amazonaws.com/0/119003/5d7a2a36-94dd-f80e-b83e-6aef3494e609.png "スクリーンショット 2017-11-29 1.40.09.png")

[URLスキームの公式ドキュメント](https://developers.line.me/ja/docs/messaging-api/using-line-url-scheme/)でそれぞれのURLスキームを確認してみてください。

### 筆者の環境
- Node.js v9.2.0
- npm 5.5.1
- macOS X El Capitan 10.11.6

## メンヘラ彼女を実装
新機能を活用してBOTを作りました。

- 彼女のメンヘラが発動します（位置情報画面を開く）
![IMG_6078.PNG](https://qiita-image-store.s3.amazonaws.com/0/119003/2de2cbed-14bb-2bee-e2dc-b8f17f2f5213.png "IMG_6078.PNG")

※1対1のトークでのみ利用できます

- 位置情報を送信する画面が開きます
- ![IMG_6079.PNG](https://qiita-image-store.s3.amazonaws.com/0/119003/e5251fe7-d554-1d54-49f8-1eadf8b996b7.png "IMG_6079.PNG")

<br />

- 場所だけでは納得しない様子です（カメラ起動）
![IMG_6081.PNG](https://qiita-image-store.s3.amazonaws.com/0/119003/41154d17-5786-4294-daab-94af83a91f5a.png "IMG_6081.PNG")

<br />

- カメラが起動し写真を送ることができます

![IMG_6084.PNG](https://qiita-image-store.s3.amazonaws.com/0/119003/ddb4a83b-81f8-b3d4-8d78-3034bc2d53eb.png "IMG_6084.PNG")

pepperと一緒で安心しました。以上です。

## 実装

位置情報はこんな感じでボタンテンプレートのなかに埋め込んでいます。

```js
let pushSendMessageObject = [{
  "type": "template",
  "altText": "this is a buttons template",
  "template": {
      "type": "buttons",
      "title": "ねえ今どこ？10秒以内に答えて。",
      "text": "Please select",
      "actions": [
          {
            "type": "uri",
            "label": "すぐに答える",
            "uri": "line://nv/location"
          },
          {
            "type": "postback",
            "label": "別れよう",
            "data": "action=cancel&selectId=2"
          },
      ]
  }
}];
```

レスポンスはこんな感じ。
![スクリーンショット 2017-11-28 18.49.30.png](https://qiita-image-store.s3.amazonaws.com/0/119003/d3f66dda-0032-f94d-090f-d0ca9bde19cf.png "スクリーンショット 2017-11-28 18.49.30.png")


カメラ起動の方もボタンに埋め込み。

```js
if (WebhookEventObject.message.type === 'location') {
  SendMessageObject = [{
    "type": "template",
    "altText": "this is a buttons template",
    "template": {
        "type": "buttons",
        "title": `${WebhookEventObject.message.address}かぁ。誰といるの？`,
        "text": "Please select",
        "actions": [
            {
              "type": "uri",
              "label": "証拠を撮る",
              "uri": "line://nv/camera/"
            },
            {
              "type": "postback",
              "label": "やっぱり別れよう",
              "data": "action=cancel&selectId=2"
            },
        ]
    }
  }];

```

レスポンスはこんな感じ。
![スクリーンショット 2017-11-29 1.29.36.png](https://qiita-image-store.s3.amazonaws.com/0/119003/1552908a-76eb-4d0c-b1fd-cad494b14d46.png "スクリーンショット 2017-11-29 1.29.36.png")

`content`エンドポイントからバイナリデータを取得します。

画像解析とかしてレスポンスを変えたら楽しそう。「その女だれ？」とか。。

## BOT開発TIPS
- LINE DeveloperのUIめっちゃ変わってました。わかりやすいです。
[![https://gyazo.com/ddd135c4362e25ad5b681880b41fd85d](https://i.gyazo.com/ddd135c4362e25ad5b681880b41fd85d.png)](https://gyazo.com/ddd135c4362e25ad5b681880b41fd85d)

<br />

- LINE BOT作成の詳しい手順は下記で紹介されています。

[1時間でLINE BOTを作るハンズオン (資料+レポート) in Node学園祭2017 #nodefest](https://qiita.com/n0bisuke/items/ceaa09ef8898bee8369d)

ローカルの検証にはngrok、デプロイにはnowがまじで便利です。

<br />

- Node.jsのSDKが公開されました

使うともっと幸せになれるはずです。

GitHub: [line/line-bot-sdk-nodejs](https://github.com/line/line-bot-sdk-nodejs)

- メンヘラっぽい写真を添えれば精度マシマシです。
![スクリーンショット 2017-11-28 15.57.44.png](https://qiita-image-store.s3.amazonaws.com/0/119003/33180c01-bcd0-d8a8-077f-cded0c5bff9e.png "スクリーンショット 2017-11-28 15.57.44.png")

## まとめ
彼氏のTwitterと連動してpush発火させたりしたら楽しそう。

BOT開発たのしい。