OneSignalで特定ユーザーにプッシュを送るためのWeb実装

OneSignal JavaScript

日本語の解説ページがあんまり見当たらなかった…。

 
OneSignalはプッシュ通知を購読登録されたとき、ユーザーを識別するOneSignal player IDなるものを払い出します。
このPlayer IDを指定して通知を飛ばすと、特定のユーザーだけに送ることができます。
このPlayer IDと他の情報を結びつけて、パーソナライズされた通知を送る実装方法のメモです。
Webでの実装方法なのでJavaScriptを扱ってますが、自分はぜんぜんJavaScriptできないのでどうかご容赦！！

初期登録までは↓が大変参考になりました。
qiita.com
 

☆やりかた☆

 1.スニペットを仕込む
OneSignalを登録したときにheadタグ内に貼ってねっていわれたやつを言われたとおりにペースト。

<link rel="manifest" href="/manifest.json" />
<script src="https://cdn.onesignal.com/sdks/OneSignalSDK.js" async=""></script>
<script>
  var OneSignal = window.OneSignal || [];
  OneSignal.push(function() {
    OneSignal.init({
      appId: "<アプリIDここにいれてね>",
    });
  });
</script>

 
ここからはOneSignalのWeb Push SDKのページもみよう！
documentation.onesignal.com

 

2.通知許可状態変更イベントを仕込む
https://documentation.onesignal.com/docs/web-push-sdk#section-callback-event-parameters

OneSignal.push(function() {
  // Occurs when the user's subscription changes to a new value.
  OneSignal.on('subscriptionChange', function (isSubscribed) {
    console.log("The user's subscription state is now:", isSubscribed);
  });
});

subscriptionChangeは、ブラウザの通知許可状態が変化すると発火します。
isSubscribedには許可状態がbooleanで入ります。

許可=true
拒否=false

このイベントは受信拒否されたときにも発火しますので注意。許可されたら発火でゎない。
 

3.Player IDを取得する
https://documentation.onesignal.com/docs/web-push-sdk#section--getuserid-

  OneSignal.getUserId(function(userId) {
    console.log("OneSignal User ID:", userId);
  });

OneSignal.getUserId()でPlayer IDが取得できます。
（User IDっていったりPlayer IDっていったり、公式の呼び方が定まらなくて混乱した）
このIDを自サーバーのAPIなんかに投げてやればOK。
あとはサーバー側でうまくやって他の情報と紐つけましょう。

 

2と3を混ぜるとこんなかんじ。

OneSignal.push(function() {
  // Occurs when the user's subscription changes to a new value.
  OneSignal.on('subscriptionChange', function (isSubscribed) {
    if (isSubscribed) {
      OneSignal.getUserId(function(userId) {
        // ここでAPIとか叩く！！！！
      });
    }
  });
});

 
4.Player IDをターゲティングしてプッシュ通知を送信する

公式に実装サンプルがあるのでこちらをどうぞ。
documentation.onesignal.com

OneSignalは驚くほどにわかりやすい。
PWAとかService Workerとか、高い壁をガンガン叩き壊してくれますね…。
生きやすい世界万歳🙏🙏🙏🙏🙏

ちなみにプッシュ送信のときには、
Segment　Tags　UserIDのいずれかから1つ指定して送信できます。
複数指定するっていうアホなことをやって軽く詰んだ（みんなに届くジャン・・・）のですが、
Tags　＜　Segment　＜　UserID
の順で優先されるようです。