Amazon Dash Buttonで家庭内コミュニケーション活性化！

## 何をするの？
キッチンやトイレでダッシュボタンを押したら、LINEでメッセージを届けます！
![image.png](https://qiita-image-store.s3.amazonaws.com/0/135266/ff92a3ac-ae86-a006-90b1-684d697fea11.png)

## 何のためにするの？
洗い物をしてくれた、トイレットペーパーを交換してくれた、ゴミをまとめておいてくれた・・・
そんなときこまめに伝えたい、夫婦間の『ありがとう』。
相手の留守などでつい忘れがちになります。
その反省から、「ボタンを押してすぐに伝わる『ありがとう』」を考えました。

## 用意するもの
### Amazon Dashボタン
好きなものを好きな数だけ！
南国っぽくて可愛い、『ヤシの実洗剤』のボタンを３つ（トイレ・脱衣所・キッチン用）購入しました。
![image.png](https://qiita-image-store.s3.amazonaws.com/0/135266/5b052f54-480e-dddf-0d33-7c59d60c68af.png)

### Raspberry Pi 3
持っていなかったのでこれを機に買いました。
ラズパイといえば、SDを買ってOSを入れて・・・
という作業が醍醐味ですが、面倒くさがり屋（私）には[キット](https://www.amazon.co.jp/Raspberry-%E3%83%9C%E3%83%BC%E3%83%89%EF%BC%86%E3%82%B1%E3%83%BC%E3%82%B9%E3%82%BB%E3%83%83%E3%83%88-Element14%E7%89%88-Computing-Lab/dp/B01CSFZ4JG/ref=sr_1_1?ie=UTF8&qid=1518833652&sr=8-1&keywords=raspberry+pi)が便利です。
また、操作に必要なディスプレイ・有線マウス・有線キーボードなども揃えました。
参考：[ラズベリーパイ3の事前準備](https://qiita.com/Yuichi801/items/5ce8236fb5d9b27f7ce0)

## Line Messaging APIの準備
[LINE developers](https://developers.line.me/ja/)に自分のアカウントでログインします。
左側のメニューから **Messaging API** を選択し、「今すぐはじめよう」を押します
![image.png](https://qiita-image-store.s3.amazonaws.com/0/135266/253f8726-2232-de8f-9df7-8c9e88086d1a.png)

### プロバイダーを選択
自分の個人名がプロバイダーの選択肢にあるので、それを選択して、「次のページ」をクリック。
（もしなければ、左メニューから「新規プロバイダー作成」してください）

### Messaging APIの情報を入力
アプリ名やアイコンはお好みのものを。
プランは「Developers Trial」を選択します。
そのほか必要項目を埋めて「確認」。
規約の同意にチェックを入れて「作成」。
![image.png](https://qiita-image-store.s3.amazonaws.com/0/135266/1254fa58-813d-930f-12d4-fcdef6f0e30e.png)


### アクセストークンを発行
API経由でメッセージを送れるように、ロングタームのアクセストークンを発行します。
※このトークンを設定ファイルに書くことになるので、ラズパイのブラウザで作業すると後で楽です。

メッセージ送受信設定のアクセストークン「再発行」ボタンを押します。
![image.png](https://qiita-image-store.s3.amazonaws.com/0/135266/e8da5485-4e89-78e7-1263-c0b018edeb0d.png)
「アクセストークンを再発行しますか？」と聞かれるので、失効までの時間は0時間のまま、「再発行」をクリック。
すると、発行されたアクセストークンが画面上に表示されます。

### LINEグループのgroupIDを取得
今回は特定のグループ（家族）に対してメッセージを送るので、あて先となるLINEのgroupIDを設定します。
実は、今回一番のハマりポイントがここ。
groupIDやuserIDは管理画面上には表示されず、ユーザーからのメッセージリクエストを受け取って確認する必要があるらしい。
今回はリクエスト内容の確認に**Zapier**を使うことにしました。
ZapierはIFTTTのようなサービス連携サービスですが、任意のWebhookを受け取れるので、手っ取り早くSSLの受け口を作るのにちょうどよいのです。
もちろん、手軽にSSL環境のAPI用意できるならそっちでOK！

#### Zapierの設定
https://zapier.com/ にログインします。
画面右上の「MAKE A ZAP!」ボタンで進みます。
「Choose a Trigger App」で「Webhooks」を選択。
次の「Select Webhooks by Zapier Trigger」で「Catch Hook」を選択。
![image.png](https://qiita-image-store.s3.amazonaws.com/0/135266/dd5791f5-6320-7982-4f34-cab5a3de9fda.png)
「Save + Continue」を押して、あと2回は何もせずにContinueを押します。
最後にこのトリガーをテストする画面が表示されるので、
WebhookのURLをコピーしてcurlでたたきます。

```bash
curl -v -H "Accept: application/json" \
        -H "Content-Type: application/json" \
        -X POST \
        -d '{"first_name":"Bryan","last_name":"Helmig","age":27}' \
        https://zapier.com/hooks/catch/n/XXXXXX/
```
その後に「OK, I did this」を押すと、「Test Successful!」が表示されるはずです。
さて、Zapier的には本来この後、Webhookのアクションを設定していくところですが、今回は一旦LINE developersに戻ります。

#### LINEのWebhook送信設定
Channel基本設定 > メッセージ送受信設定の「Webhook送信」を「利用する」に設定します。
その下の「Webhook URL」に、先ほどZapierでコピーしたWebhook URLを貼り付け。
これで、このチャンネルに対してメッセージが送信されたとき、ZapierのWebhookが呼ばれるようになりました。

#### WebhookからgroupIDを拾う
スマホのLINEアプリを立ち上げて、「友だち追加」 > 「QRコード」を選び、
LINE developersのChannel基本設定の最下部にあるQRコードを読み取り、友だち追加します。
「友だち追加」 > 「グループ作成」で、追加したbotとのグループを作ります。
さて、Zapierの「Test this Step」に戻り「Re-test Webhooks...」ボタンを押します。
再度テスト待ち受け状態になるので、作成したLINEのグループで適当に発言。
LINEのWebhook送信先であるZapierのTriggerが呼ばれているはずなので、「OK, I did this」を押します。
![image.png](https://qiita-image-store.s3.amazonaws.com/0/135266/6a539e15-aafc-c836-ae19-f669ffad0b07.png)
テスト成功後の画面の中央あたり「view your hook」のリンクを開きます。
するとhook時に送信されたJSONの内容が以下のように表示されます。

```
message: {u'text': u'\u3066\u3059\u3068', u'type': u'text', u'id': u'XXXXXXXXXXXXXXX'}
replyToken: XXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
source: {u'type': u'group', u'userId': u'XXXXXXXXXXXXXXXXXXXXXXXXXXXXXX', u'groupId': u'XXXXXXXXXXXXXXXXXXXXXXXXXXXXXX'}
timestamp: 1518841370080
type: message
```

**groupID**がありました！
Zapierの設定が中途半端ですが、groupIDをメモしたらもう用事はありません。

## Dash Buttonをハック
いよいよダッシュボタンを触ってゆきます。
### ハックの準備
手元のスマホを使っての設定です。
Amazonアプリを立ち上げ、「アカウントサービス」→「新しい端末をセットアップ」の手順でセットアップします。
最後に商品選択の画面になりますが、**商品を選ばずに×ボタンでキャンセル** します。
これでハックの準備は完了。

参考にしました！
[Amazon Dash Button でおうちハックしようその1 セットアップ編](https://qiita.com/tokio-takeda/items/02bae474f8f20f35a02c#%E3%83%8F%E3%83%83%E3%82%AF%E3%81%AE%E6%BA%96%E5%82%99)

### ラズパイにDasherをインストール
#### node.jsとnpmを入れる
```bash
sudo apt-get install -y nodejs npm
```
`node -v` `npm -v`でバージョンが表示されればOK。
※どうやらこれでは古いバージョンのものしか入らないらしい。
最新にしたい場合は[こちらの記事](https://qiita.com/setouchi/items/437e4b62e4210871496f)等をご参考ください。

また、nodeの実行を永続化するためにforeverも入れておきます

```
$ sudo npm i forever -g
```

#### gitを入れる
```bash
sudo apt-get install git
```

#### Dasherを入れる
```bash
git clone https://github.com/maddox/dasher.git
cd dasher
npm install
```

### DashボタンのMacアドレス確認
```bash
$ script/find_button
```
```
Watching for arp & udp requests on your local network, please try to press your dash now
Dash buttons should appear as manufactured by 'Amazon Technologies Inc.' 
```
上のような文字が表示されたら、ダッシュボタンを押します。

```
Possible dash hardware address detected: XX:XX:XX:XX:XX:XX Manufacturer: unknown Protocol: udp
```
なぜだかunknownと表示されていますが、これがダッシュボタンのようです。
（Protocolがudpになっていて、Manufacturerが 'unknown' か 'Amazon Technologies Inc.' のものを見ればよさげ）

### Dashボタンを押したらメッセージを飛ばす設定
設定用のjsonに、Webhookの設定をします。
サンプルからの加工が楽です。

```bash
$ cp config/config.example.json config.json
$ vi config/config.json
```

```json:config.json
{"buttons":[
  {
    "name": "thanks button in restroom",
    "address": "↑で取得したダッシュボタンのMacアドレス",
    "protocol": "udp",
    "url": "https://api.line.me/v2/bot/message/push",
    "method": "POST",
    "headers": {"Content-Type": "application/json", "Authorization": "Bearer ↑で取得したLine Messaging APIのアクセストークン"},
    "json": true,
    "body": {"to": "Zapierで取得したLINEのgroupID", "messages": [{"type": "text", "text": "ありがとうが届きました！（トイレ）"}]}
  }
]}
```
```bash
$ npm start
```
ここでダッシュボタンを押します。
LINEのグループにメッセージが届けば大成功！
![image.png](https://qiita-image-store.s3.amazonaws.com/0/135266/46aeb28e-49d6-ed00-779a-3c76eaeeb073.png)


永続化のため、nodeのプロセスをデーモンで起動し直します。

```
$ sudo forever start app.js
```

残りのボタンもconfig.jsonに追加します。
作成したLINEのグループに、「ありがとう」を伝えたい家族を追加して、ダッシュボタンをそれぞれの場所に配置したら完成！