DashButton Hack! その２

tetlab117.hatenablog.com こちらの記事の続きです。

前回は、DashButtonを押したイベントを取得しましたが、その２では、IFTTTとの連携を行おうと思います。

IFTTTとは？

まぁ、今更説明する必要はなさそうですが。 簡単にいうと、異なるWebサービスなどを連携させることができるサービスです。 たとえば、Twitterで特定のつぶやきを自動的にEvernoteにアップロードしてくれるなどのことを、わざわざコーディングする必要がなく自動でやってくれる便利なサービスです。

今回やること

IFTTTではTwitterで特定の言葉をつぶやいたりするなど、Webサービスをトリガーにすることが多いですが、Webhookをトリガーにすることができます。 今回はDashButtonを押した際に、IFTTTにWebhookを送り、IFTTTがそれをトリガーにして、Googleスプレッドシートに出勤と退勤を書き込むサービスを作ります。

こんな感じ

IFTTTでアプレットを作成

ということで、まずはIFTTTのアプレットを作っていこうと思います。

[New Applet]のタブを選択肢するとこんな感じの画面になります。

thisを押すとトリガーとなるサービスを選択する画面になります。 そこでWebhooksを選択

Event Nameは適当に

お次はthatを選びます。

Googleスプレッドシートはないので、GoogleDriveを選択します。

GoogleDriveの項目に、スプレッドシートへの追加があります。

次に、スプレッドシートの設定をします。 スプレッドシートの名前は適当にわかりやすいものを。 フォーマットは、わかりやすいように、投稿された時間と、Value1とVlaue2を入れます。

あとは、フォルダーのパスも適当に入れてください。 そのあと、Create Actionを押してください。

Value1やValue2には、コードからWebhookを送る際に、JSON形式で好きな値を入れることができます。 今回はValue1には名前、Value2には出勤や退勤などの状態を入れることにします。

これが終われば、IFTTT上での作業はほぼ終わりです。 最後に、Webhooksのドキュメントの画面からAPIキーやリクエストのURLを取得しましょう。

コーディング

ということで、IFTTTの設定も終わったので、コーディングしていきます。 前回、Node.jsでDashButtonのイベントを取得したので、今回もNodeで書いていきます。 まずは、IFTTTにWebhookを投げるコードです。

var request = require('request');

//IFTTTのWebhookの中身
var options = {
  uri: "https://maker.ifttt.com/trigger/{event_name}/with/key/{your_api_key}",
  headers: {
    "Content-type": "application/json",
  },
  json: {
    "value1": "名前",
    "value2": contents
  }
};

//IFTTのWebhookへpostする
request.post(options, function(error, response, body){});

まずは、Nodeのrequestモジュールを読み込み、Webhookの中身を書き、POSTしています。 uriの{event_name}には、IFTTTでWebhooksに設定した、Event_nameを入れてください。 {your_api_key}には、IFTTTのドキュメントに記載されているものを使用してください。

Value2には、変数「contents」の中に出勤か退勤の文字を入れるのですが、今回は、contents_switchという変数にtrueかfalseかのブール値を入れ、contents_switchがtrueの場合は「出勤」という文字を変数contentsにいれ、contents_switchをfalseに変える、contents_switchがfalseの場合は「退勤」という文字を変数contentsにいれ、contents_switchをtrueに変えるようにしましょう。

var contents　 = "出勤";
var contents_switch = true;


  if(contents_switch === true){
    contents = "出勤" ;
    contents_switch = false; 
  }else if(contents_switch === false){
    contents = "退勤";
    contents_switch = true;
  };

これらのコードを前回のDashButtonのイベントを取得するコードに入れていくとこんな感じです。

const dash_button = require('node-dash-button');
var request = require('request');
// Dashボタンのアドレス
const dash = dash_button('××:××:××:××:××:××', null, null, 'all');

var contents　 = "出勤";
var contents_switch = true;

// ボタンをクリックしたときのアクション
// クリックしてから数秒遅延します。
dash.on('detected', () => {

  if(contents_switch === true){
    contents = "出勤" ;
    contents_switch = false; 
  }else if(contents_switch === false){
    contents = "退勤";
    contents_switch = true;
  };

//IFTTTのWebhookの中身
var options = {
  uri: "https://maker.ifttt.com/trigger/{event_name}/with/key/{your_api_key}",
  headers: {
    "Content-type": "application/json",
  },
  json: {
    "value1": "名前",
    "value2": contents
  }
};

//IFTTのWebhookへpostする
request.post(options, function(error, response, body){});
});

これを

node app.js

ターミナル上で実行した状態で、DashButtonを押すと、 こんな感じで、IFTTT上で、設定したスプレッドシートに書き込めるはずです。

最後に

今回はIFTTTを用いて、スプレッドシートに書き込みを行いましたが、スプレッドシート以外にもボタンを押せばTwitterで呟いたりするなど、結構いろんなことができます。 もちろん、IFTTTを使わなくても、プッシュイベントを取れるなら、いろんなことができるので、ぜひやってみてください。

みんなもDashButtonを買って、Let`s Hack!!