OITA: Oika's Information Technological Activities

@oika 情報技術的活動日誌。

IFTTT 自作アプリからHTTPリクエストでスマホへプッシュ通知

IFTTT(イフト)はいろんなWebサービス同士を連携させるためのWebサービスでございます。

IF This Then That 」という名前の表すとおり、Thisをトリガとして、Thatのアクションを起こす
(例:Instagramでいいねをつけたら、Evernoteに自動保存する)
という形で連携を定義する。

この「This」のトリガ部分に、既存のサービスだけでなく、自前のアプリからのHttpリクエストを使うこともできる。
のだけど、このイフトは何回かUIや用語に大きな変更があって、調べながらやろうとしたらけっこう苦戦した。
(もう「レシピ」とか呼ばないのよ)

なので、2017年9月現在の、自前トリガからスマホへのプッシュ通知を実現する手順をまとめておきます。
Web画面ベースで説明するけど、スマホアプリからでもほぼ同様。

準備

IFTTTのアカウントを作成しておく。
あと、スマホへの通知を受け取るために、スマホ側でIFTTTアプリを入れておく。
もちろん通知も許可しておく。

新規アプレット作成

・メニューの「 My Applets 」から、「New Applet」(スマホアプリだと「+」ボタン)を押下

HTTPトリガ作成

・「if this then that」と書かれた画面で this の部分の「+」を押下

IFTTT This

・「web」とか検索すると出てくる Webhooks を選択

IFTTT Webhooks

・「 Receive a web request 」を選択

Event Name に任意のイベント名を入力(ここではhelloとします)

IFTTT Event Name

・Create Trigger(スマホアプリではNext)

通知アクション作成

・「if this then that」と書かれた画面で、今度は that を選択

Notifications を選択

IFTTT Notifications

・「 Send a notification from the IFTTT app 」を選択

・通知の文章を作成
 - 「{{EventName}}」の部分には、先ほどのイベント名(hello)が入ります
 - 「{{value1}}」「{{value2}}」「{{value3}}」の形で、トリガ呼び出し時に受け渡す値を表示することができます

IFTTT Notification Message

・Create Action(スマホアプリではNext)

・Finish

呼び出し方

・My Appletsメニューから、先ほど作ったアプレットを選択

・左上のWebhooksアイコンを選択し、Webhooksのページを開く

IFTTT Webhook Icon

Documentation を押下

IFTTT Documentation

・「Your key is:」のあとに表示される自分のキーを確認

あとは、同ページに表示されているとおり
https://maker.ifttt.com/trigger/{イベント名}/with/key/{キー}」
のURLに対してPOSTまたはGETでリクエストを投げます。

C#のHttpClientでやるなら↓こんな感じ。
このへんはわかっている前提で、説明は割愛です。

//string yourKey = "xxxx_xxxx_xxxxxxx";  
var url = "https://maker.ifttt.com/trigger/hello/with/key/" + yourKey;  

//受け渡す値  
var values = new Dictionary<string, string>  
{  
    { "value1", "佐藤" },  
    { "value2", "鈴木" }  
};  

using (var client = new HttpClient())  
{  
    await client.PostAsync(url, new FormUrlEncodedContent(values));  
}  

スマホ側で受信される。

IFTTT Push

以上だぜ。