Onesignalを使ってWordPressにWeb Pushを実装してみた

Web Push

Web Pushとは過去にサイトに訪れて購読登録したユーザーに、管理者がメッセージを送れる機能です。

これのことだと思ってます。

f:id:himrr:20171121192645j:plain

今回はOnesignalを使ってこのWeb Pushを導入してみようと思います。

 

Onesignal

とにかく使いやすく無料で使える機能がとても多いです。

iOS, Android, Web Push, Unityなどに対応していて近日中にAmazon Alexaに対応するとか。

 

 導入方法

まずはOnesignalに登録して新しいappを作成します(割愛)。

 

Select Platform

f:id:himrr:20171121193423p:plain

Web pushということで下段真ん中を選択。

 

f:id:himrr:20171121193505p:plain

今回はChromeFirefoxを選択しました。

せっかくSafariも対応しているそうなのでこっちもいずれ導入したいですね。

 

Configure Platform

f:id:himrr:20171121193700p:plain

こちらに該当サイトのURLを貼り付けます。サディレクトリの場合でもドメインまでとのこと。

 

Select SDK

f:id:himrr:20171121193816p:plain

その後、Wordpressを選択してNEXTするとRest API KeyとApp IDが手に入ります。

 

 OneSignal Push

 Word Pressの管理画面からOneSignal Push > Configurationへ。

f:id:himrr:20171121194215p:plain

ここにさっきのRest API KeyとApp IDを貼り付けます。

※OneSiganalの管理画面とは順番が逆になっているので注意

 

その後最下部にある「Save」をクリックして導入することができます。

f:id:himrr:20171121201152p:plain

こういうエラーが出ますが、ひとまず気にせずにフロント側で確認してみましょう。

右下のベルから購読登録ができるようになっています。

 

Install SDK

 

f:id:himrr:20171121205220p:plain

購読登録後、「Check Subscribed Users」を押すことでこの緑の部分が表示されると思います。

そうしたら「DONE」を押して、終了です!簡単ですね!

ちなみにですが誰も購読登録していない状態で「Check Subscribed Users」を押すと緑ではなく赤の文字が出ます。

 

次回は設定等を詳しく見ていきたいと思います!