iwathiの/var/log

生活と仕事の効率化が趣味。

Withings + IFTTT + ThingSpeakで全自動体重グラフ化

f:id:iwathi3:20171019122631j:plain

全自動で周知ダイエット

しばらく前からダイエットをしている。 「周知ダイエット」だ。

体重計に乗ると勝手に体重計からTwitterに今の体重がつぶやかれる。

更にThingSpeakにもデータが蓄積されグラフが作成される。


実際つぶやかれるものがこの様な感じだ。


また同時に体重変化の推移に関してもグラフ化し公開している。


グラフ化されたものがこちら↓↓。

thingspeak.com


ちなみにこのために自前のサーバやVPS等を用意する必要はない。

今回はIFTTTを使ったグラフ化のやり方を説明していく。


準備


始めに実現に向けた前提条件と必要なものについて述べる。

前提条件

  • サーバレス
  • WiFi環境有り
  • ThingSpeakのAPIを使用可能
  • Withings WS-50のセットアップ済み

IFTTTとThingSpeakの機能を使うのでサーバは不要。


Withingsのセットアップに関しては他のブログなどを参照。

www.chaffflare.jp


ThingSpeakのセットアップに関してはこちらを参照。

iwathi3.hatenablog.com


必要なもの

  • ThingSpeak API
  • IFTTT アカウント
  • Withings WS-50(現 WBS05)

勝手にTwitterにつぶやくために必要な体重計WS-50(WBS05)はこちら

(WithingsがNOKIAに買収されたことにより商品名が変わっている)

ASCII.jp:さよならWithings、ノキアが日本のコンシューマ市場に再参入し6月21日より完全移行


また上記の廉価モデルが出ている。

これは体脂肪等の体組成の計測ができないモデルとはなっている。

5,609円とかなり安くなっているため楽に体重の計測をしたい人におすすめだ。

(2017/10/18 現在)


動作の概要

体重計に乗ってからグラフ化されるまでの流れはこの様になる。

f:id:iwathi3:20171019135742p:plain

設定が必要なのが③・④・⑥の部分だ。

詳しくはセットアップの部分で記述する。

セットアップ

③・④はIFTTTの機能を使いWithings←→ThingSpeakの連携を行う。

「体重測定」をトリガーに設定し、「データ送信」をアクションに設定。


⑥はThingSpeakでデータを格納しグラフ化する器を作る。


構築の手順としてはThingSpeakのAPIキーが必要となるため

ThingSpeakを始めに設定しIFTTTで設定を行う。


大まかなセットアップの手順は下記の通りだ。

  1. ThingSpeakでグラフの器を作成
  2. IFTTTにWithingsとThingSpeak連携させるアプレットを作成

それでは具体的な設定方法を記述していく。


ThingSpeakの設定

 ThingSpeakはチャネルという単位でデータを管理している。 そのため今回のグラフ化に使うチャネルの作成を始めに行う。

Channelの作成

右上のハンバーガーメニューをクリックし、ChannelsからMy Channelsを選択。

f:id:iwathi3:20171019205858p:plain


My Channelsには作成されたChannelが表示される。

今回は新しくChannelを作成するので、New Channelsを押してChannelを作成する。


f:id:iwathi3:20171019210135p:plain

Channelへグラフ(Field)を設定

次に表示されるのが作成するChannelの情報だ。


Name, Description, Field 1〜8等を記入していく。

NameがそのChannelの名前となり、Descriptionが文字通りのその説明。


f:id:iwathi3:20171019210201p:plain

ここではField 1〜4を分かりやすくField 1〜4と名付けている。

Fieldが1グラフを表すこととなる。つまりこの例では4つのグラフが作成されることになる。


実際にはこのField名を「weight」「Fat」等にするのが良いだろう。


f:id:iwathi3:20171019210256p:plain

全て記入が終わったらSave Channelを押す。


すると次の様な画面が表示される。

下の赤丸の様に「Field 1 Chart」というグラフの器が4つ作成されていることが確認できる。


f:id:iwathi3:20171019210315p:plain

これでグラフの作成は完了となる。


API Keyの確認

このChannelを使うためのAPI Keyの確認方法について説明する。


上に並んでいるメニューから「API Key」をクリック。

すると「Write API Key」というところにKeyが表示される。

このAPI Keyを使いThingSpeakへデータを受渡す。


そのためこのAPI Keyをコピーしておく。

f:id:iwathi3:20171019210335p:plain


これでグラフ化するための器の準備は完了だ。


IFTTTの設定

 IFTTTではアプレットという単位でサービス連携の管理をする。

またそのアプレットはトリガーとアクションから構成されている。


始めにアプレットの作成から行っていく。


アプレットの作成

IFTTTへログインをしたら右上のアカウント名をクリックしメニューを開く。

その「New Applet」を選択しアプレットを作成していく。


f:id:iwathi3:20171019210427p:plain

ThingSpeakへデータを送る条件の設定(トリガー)

「this」を押しトリガーを設定していく。

f:id:iwathi3:20171019210445p:plain



次画面ではサービスを選択する。

だが多すぎて探すのが大変なため、検索欄に「Withings」と入力しサービスを絞る。

Withingsのパネルをクリックして選択する。

f:id:iwathi3:20171019210530p:plain



続いてトリガーを設定する。


トリガーに設定するのはそのサービスでの「イベント」だ。

ここでは「Withingsで体重測定を行う」というイベントをトリガーにしたい。

そのため「Body Scale - New Measurement」を選択する。


f:id:iwathi3:20171019210548p:plain


ちなみにWithingsは個人を判別するため、このIFTTTに設定したものは自分が乗ったときにしかグラフ化されない。

そのため家族でこの体重計を共有しても適正に体重の管理をすることができる。


ThingSpeakへ送るデータの設定(アクション)

続いてはアクションの設定をしていく。

これはトリガーが発生した際に「何をするのか」を設定する。


thatを選択する。

f:id:iwathi3:20171019210602p:plain

同じくサービスを選択する。

ここではPOSTリクエストを使用したい。


「webhook」を選択すればPOSTリクエストが可能であるため

先ほどと同様に検索欄に「web」と入力しパネルを選択する。

f:id:iwathi3:20171019210708p:plain

アクションは1つしかない。

「Make a web request」を選択。


f:id:iwathi3:20171019210724p:plain

Web Requestのパラメータ設定

ここでは選択・入力する項目が4つある。

  • URL
  • Method
  • Content Type
  • Body

これはHTTPリクエストをどんな形でどんな風に送信するかの設定だ。

Body以外はThingSpeakのWrite APIを使う場合には共通の内容となる。


そのためBody以外はこの様に記載していく。

f:id:iwathi3:20171019210815p:plain




ここからBodyを記入していく。

記入例としては下の様になる。

f:id:iwathi3:20171019210834p:plain

BodyにはThingSpeakで設定した項目とWithingsのデータ名を入力する。

入力内容は以下の様なフォーマットになる。


key=[①ThingSpeakのAPI key]&[②設定したField名]=[③Withingsデータ名]


上記の様に記入する項目は大きく3つ

  1. 黒塗りされた箇所に先ほどコピーしたThingSpeakで生成されたAPI keyをペースト
  2. 赤下線にThingSpeakで設定したField名(field1 ~ field4)
  3. オレンジ下線にWithingsのデータ(WeightKg, LeanMassKg, FatMassKg, FatPercent)


この様にしてThingSpeakのfield名とWithingsのデータ名を紐づける。

そして紐付けたデータをAPI keyを使い送信する。

そうするとAPI keyと対応するchannelへThingSpeakへデータが送られるという仕組みだ。


全ての記入が終わったら「Create action」ボタンを押す。

f:id:iwathi3:20171019210901p:plain

最後に確認をし、「Finish」を押せば完成だ。

f:id:iwathi3:20171019210915p:plain

作成したアプレットはこのオンオフボタンでいつでも有効・無効を切り替えられる。



あとがき

この様にIFTTTとThingSpeakを使うことでサーバレスでグラフ化が可能性となった。

今回使用したIFTTTのwebhookは他のAPIを使う時に便利なため他のAPIとの連携も試していこうと思う。

※なお、周知ダイエットに関しては効果がないことは身をもって経験済みである。  2017/10/20まででの体重減に関してはまた後日記載予定。