ニフクラ mobile backend(mBaaS)お役立ちブログ

スマホアプリ開発にニフクラ mobile backend(mBaaS)。アプリ開発に役立つ情報をおとどけ!

Expoアプリのプッシュ通知をNCMBで管理する

f:id:mbaasdevrel:20180306160753p:plain

React Nativeの開発を簡単にしてくれるExpoはプッシュ通知機能を提供しています。手軽に利用できる反面、デバイストークンを管理する場所が別途必要であったり、トークンはExpo独自のものになっており、移行が難しいといった問題があります。

そこで今回はExpoアプリでもNCMBを使ってプッシュ通知を送信できる方法について紹介します。

注意点

Expoではデバッグビルドがないため、実際にリリースしないとプッシュ通知の動作確認が行えません。仕様上は問題ないはずですが、現状は不具合がある可能性もあります。

ライブラリのインストール

npmでライブラリをインストールします。

npm i ncmb-expo-push

使い方

まずライブラリをインポートします。

import NCMBPushNotification from 'ncmb-expo-push'

インスタンスを作る際にアプリケーションキーとクライアントキーを指定します。

const ncmbPush = new NCMBPushNotification('YOUR_APPLICATION_KEY', 'YOUR_CLIENT_KEY');

後は setDeviceToken メソッドを実行すると、デバイストークンの取得とNCMBへの保存を一緒に行ってくれます。

try {
  await ncmbPush.setDeviceToken();
} catch (e) {
  console.log(e);
}

デバイストークンの取得

Installationからデータを取り出す際には getInstallation を実行してください。これはNCMBInstallationクラスであり、NCMBObjectを継承しています。 set メソッドでデータを追加したり save メソッドで保存ができます。

const installation = await ncmbPush.getInstallation();
await installation
  .set('category', 'document')
  .save();

まとめ

ncmb-expo-pushが取得するデバイストークンはExpo独自のものではなく、実際のデバイストークンとなっています。そのため移行したり、デバイストークンを直接指定してプッシュ通知を送信することも可能です。Expoのプッシュ通知ではデバイストークンの保存が必要になりますので、その上でもNCMBを使ってみてください。

NCMBMania/react-native-push-notification

中津川 篤司

中津川 篤司

NCMBエヴァンジェリスト。プログラマ、エンジニアとしていくつかの企業で働き、28歳のときに独立。 2004年、まだ情報が少なかったオープンソースソフトの技術ブログ「MOONGIFT」を開設し、毎日情報を発信している。2013年に法人化、ビジネスとエンジニアを結ぶDXエージェンシー「DevRel」活動をスタート。