ReactNativeでプッシュ通知を実装する方法
この記事ではReactNativeでのプッシュ通知の実装方法を紹介したいと思います。
まず最初に全体の設計はこんな感じです。
Application
Backend(ここでは例としてRailsを想定しています)
- identifierをアプリから受け取ります
- DBにidentifierを保存します (
endpoint_arn
を保存しましょう) endpoint_arn
を登録して、トピックをサブスクライブします- いつ通知を送るのかをAWS SNSに教えます(cronなどでトリガーを用意するという意味です)
endpoint_arn
を保存します- トピックを作ります(ユーザーグループのようなものです)
- 通知を送ります
ライブラリ群
- ReactNative
- Rails
- aws-sdk-rails
- whenever (もしcronを使いたければ便利です)
- AWS SNS
in ReactNative
アプリからidentifierを送る必要があります。ReactNativeではindex.android.js
や index.ios.js
に実装コードを書くのがよいのではないでしょうか。OS毎に設定が多少違うので、ここだとその差異を吸収しやすいと思います。
例としてスクリプトを載せておきます。
in Rails(Backend)
まず、aws-sdk-rails用にinitializerを用意するのが良いでしょう。
Controller内でidentifierを受け取るためのアクションを定義しておきましょう。もしそれが新規identifierであればAWS SNSに登録します。AWS SNSにリクエストを送るとendpoint_arn
を受け取ることができます。DBに保存しておきましょう。
上記の Aws::Sns::DeviceTokenRegisterer.register(device_token)
はサービス層に用意しています。endpoint_arn
を登録するために呼んでいます。
ここでは、2つのトピックをendpointとしてサブスクライブしています。この記事の始めに書いた通り、トピックとはユーザーグループのようなものです。ここでは2つのトピックを作りました。ひとつはすべてのデバイスに対して、もうひとつはAndroidかiOSのどちらかのみというものです。AWS SNSの設定に関してはAWSのdocumentを参照してみてください。
最後に、プッシュ通知イベントを発火します。下記、サンプルコードです。
これで全てです。それほど複雑ではないですよね。AWS SNSは便利ですし、比較的値段も安いです。ぜひ利用してみましょう。もし質問や意見、提案などございましたらぜひコメントに書いていただければと思います。
それでは。