コンテンツにスキップ

通知の開封


アプリ起動時に取得できる情報

端末の通知一覧画面(iOS:通知センター / Android : 通知ドロワー)からプッシュ通知をタップしたり、通知詳細ダイアログからアプリが起動された場合、タップしたアクションボタンの情報や拡張プロパティを取得することができます。


通知詳細ダイアログ

iOS Android

(Android)通知ドロワーでプッシュ通知をタップした時の挙動について

Androidでは、RichFlyerで配信したプッシュ通知を通知ドロワーでタップした際、アプリが起動するパターン通知詳細ダイアログを表示するパターン があります。 通知詳細ダイアログでは、アクションボタンを表示したり動画の再生などを行います。

Aパターン: アプリが起動するパターン
Bパターン: 通知ダイアログが表示されるパターン

アクションボタンなし アクションボタンあり
テキストのみ A B
静止画添付 A B
動画/GIF添付 B B


プッシュ通知開封時の処理

プッシュ通知を開封したときに、ユーザーがタップしたボタンや拡張プロパティを取得する場合は、次のメソッドを呼びます。 コールバックで情報を取得することができます。

Note

次の場合も同じコールバックが呼ばれます。

// RichFlyerクラス
addOpenNotificationListener(callback: (action: RFAction) => void): void
パラメータ 内容
callback アクションボタンがタップされたときに呼ばれるコールバック。 アクションボタンや拡張プロパティの情報(RFAction)を取得できる。


アクションボタン情報

押されたアクションボタンの情報はRFActionクラスの各メンバー変数に格納されます。

export type RFAction = {
  title: string; // アクションボタンの名前
  type: string;  // アクションの種類 scheme:カスタムスキーム、url:httpスキームのURL
  value: string; // アクションに設定した値
  index: number; // ボタンのインデックス
  extendedProperty: string;  // 拡張プロパティ
  notificationId: string; // 通知識別子
};


実装例

Example
const richflyer = new RichFlyer();

richflyer.addOpenNotificationListener((action: RFAction) => {
  if (action.extendedProperty) {
    // 通知一覧からアプリが起動された
    console.log(`extendedProperty:${action.extendedProperty}`);
  } else if (action.title) {
    // 通知詳細ダイアログでカスタムアクションボタンが押された
    console.log(
      `title:${action.title} type:${action.type} value:${action.value}`
    );
  }
});


通知を開封せずにアプリ起動した時に通知を表示する(起動時通知)

通知受信後に通知を開封せずにアプリを起動した際に直前に受信した通知を表示することができます。(起動時通知)
通知のタイプによって有効・無効を設定することが可能です。
デフォルトでは、動画またはGIFが添付された通知で起動時通知が有効になっています。
無効にする場合は、空の配列を指定します。


通知のタイプ

export const RFLaunchMode = {
  Text: 'Text',   // テキストのみ
  Image: 'Image', // 静止画を添付
  Gif: 'Gif',     // GIF画像を添付
  Movie: 'Movie', // 動画を添付
};


起動時通知を有効にする方法

初期化時に有効にしたいプッシュ通知のタイプを配列で指定します。

設定例

const settings = {
    serviceKey: '11111111-aaaa-bbbb-cccc-222222222222',
    launchMode: [RFLaunchMode.Movie, RFLaunchMode.Gif],
    groupId: 'group.net.richflyer.app',
    sandbox: true,
    themeColor: '#468ACE',
    prompt: {
        title: 'お得な情報をお知らせ',
        message: 'プッシュ通知を許可するとお得な情報が届きます!',
        image: 'pushImage',
    },
};