OneSignalでお手軽Push通知スケジューラーを作る

PWA Advent Calendar 2019 11日目の記事です。

PWAというよりもOneSignalがメインの記事です。
OneSignalでお手軽Push通知スケジューラーを作る話です。

はじめに

• Nuxt PWA OneSignal ModuleでOnesignalが導入できている前提です(ここはNuxtじゃなくてもOneSignalが導入できていればOKです)
• 導入とかはNuxtでPWA対応WebアプリにOneSignalからプッシュ通知を送る系の記事を参照してください
• Dateのフォーマットにはdateformatを使います

詳細とか

OneSignal Create notification API
を見ると

send_after:
 
Schedule notification for future delivery. API defaults to UTC -1100

Examples: All examples are the exact same date & time.

とありましたので、これを使います。

ベースとなるパラメータ

const params = {
  method: "post",
  url: "https://onesignal.com/api/v1/notifications",
  headers: {
    "Content-Type": "application/json",
    Authorization: `Basic ${process.env.ONESINGAL_REST_API_KEY}` // 環境変数
  },
  data: {
    app_id: process.env.ONESINGAL_APP_ID, // 環境変数
    headings: {
      en: "notification test",
      ja: "name:hogeの人に通知です"
    },
    contents: {
      en: "This is notification test",
      ja: "name:hogeの人に通知です"
    },
    // オプションフィルターなので任意ここでは独自のnametag'hoge'と一致するユーザーに送る
    filters: [
      {
        field: "tag",
        key: "name",
        relation: "=",
        value: 'hoge'
      }
    ]
  }
};

５分後に送りたい場合

var dateFormat = require("dateformat");

let afterFiveMinutes = new Date();
afterFiveMinutes.setMinutes(afterFiveMinutes.getMinutes() + 5);
dateFormat(afterFiveMinutes, "isoDateTime");

const params = {
  method: "post",
  url: "https://onesignal.com/api/v1/notifications",
  headers: {
    "Content-Type": "application/json",
    Authorization: `Basic ${process.env.ONESINGAL_REST_API_KEY}`
  },
  data: {
    app_id: process.env.ONESINGAL_APP_ID,
    headings: {
      en: "notification test",
      ja: "name:hogeの人に通知です"
    },
    contents: {
      en: "This is notification test",
      ja: "name:hogeの人に通知です"
    },
    send_after: {
      afterFiveMinutes
    },
    // オプションフィルターなので任意ここでは
    filters: [
      {
        field: "tag",
        key: "name",
        relation: "=",
        value: 'hoge'
      }
    ]
  }
};
axios(params).then(res => {
  console.log(res.data); // responseにセットした通知ID等が返却される
});

これで独自のnametag'hoge'と一致するユーザーに５分後に送れます。

独自のタグを設定する方法とか

OneSignall SDK Referenceを参照

具体的にコードを書くと

OneSignal.push(function() {         
  OneSignal.sendTag("key", "value", function(tagsSent) {
    // Callback called when tags have finished sending
  });
});

独自のnametag'hoge'を設定したい場合

OneSignal.push(function() {         
  OneSignal.sendTag("name", "hoge", function(tagsSent) {
  });
});

複数のタグを設定したい場合

sendTagsを使う。例を上げると

OneSignal.push(function() {
  OneSignal.sendTags({
    key: 'value',
    key2: 'value2',
  }, function(tagsSent) {
    // Callback called when tags have finished sending    
  });
});

nametag:'hoge' emailtag: 'hoge@com'にしたいときは

OneSignal.push(function() {
  OneSignal.sendTags({
    name: 'hoge',
    email: 'hoge@com',
  }, function(tagsSent) {
  });
});

これで独自のタグを設定できる。

最後に

結構面倒なPush通知もOneSignalを使えば簡単にできる上に、スケジューラーとして設定することも簡単にできました。OneSignal結構便利ですね！