Skip to content

ソフトプッシュプロンプト

多くの場合、サイトでは「ソフト」プッシュプロンプトを実装することをお勧めします。このプロンプトでは、プッシュ許可を要求する前に、ユーザーを「プライム」し、プッシュ通知を送る理由を説明します。これは、ユーザーに直接プロンプトを表示する頻度がブラウザーによって調整され、ユーザーがアクセス許可を拒否した場合は二度とユーザーに求めることができないため便利です。この記事では、Webアプリケーションのプッシュプライマーキャンペーンを作成するために、Web SDKインテグレーションを修正することについて説明する。

また、特別なカスタム処理を含めたい場合は、標準の Web プッシュ統合で説明されているように、requestPushPermission() を直接呼び出すのではなく、トリガーされたアプリ内メッセージを使用します。

ステップ 1:プッシュ・プライマー・キャンペーンを作成する

まず、Braze ダッシュボードで「Prime for Push」アプリ内メッセージングキャンペーンを作成する必要があります。

  1. 希望するテキストとスタイリングでモーダルなアプリ内メッセージを作成する。
  2. 次に、クリック時の動作を「メッセージを閉じる」に設定する。この動作は後でカスタマイズする。
  3. メッセージにキーと値のペアを追加する。キーはmsg-id 、値はpush-primer 。
  4. カスタムイベントトリガーアクション（”prime-for-push “など）をメッセージに割り当てる。必要に応じて、ダッシュボードから手動でカスタムイベントを作成することもできます。

ステップ2:呼び出しを削除する

Braze SDK 統合で、読み込みスニペット内から automaticallyShowInAppMessages() の呼び出しを見つけて削除します。

ステップ 3:アップデートの統合

最後に、削除したコールを以下のスニペットで置き換える：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41

import * as braze from "@braze/web-sdk";
// Be sure to remove any calls to braze.automaticallyShowInAppMessages()
braze.subscribeToInAppMessage(function(inAppMessage) {
  // check if message is not a control variant
  if (inAppMessage instanceof braze.inAppMessage) {
    // access the key-value pairs, defined as `extras`
    const keyValuePairs = inAppMessage.extras || {};
    // check the value of our key `msg-id` defined in the Braze dashboard
    if (keyValuePairs["msg-id"] === "push-primer") {
      // We don't want to display the soft push prompt to users on browsers
      // that don't support push, or if the user has already granted/blocked permission
      if (
        braze.isPushSupported() === false ||
        braze.isPushPermissionGranted() ||
        braze.isPushBlocked()
      ) {
        // do not call `showInAppMessage`
        return;
      }

      // user is eligible to receive the native prompt
      // register a click handler on one of the two buttons
      if (inAppMessage.buttons[0]) {
        // Prompt the user when the first button is clicked
        inAppMessage.buttons[0].subscribeToClickedEvent(function() {
          braze.requestPushPermission(
            function() {
              // success!
            },
            function() {
              // user declined
            }
          );
        });
      }
    }
  }

  // show the in-app message now
  braze.showInAppMessage(inAppMessage);
});

ユーザーにソフトプッシュプロンプトを表示する場合は、このアプリ内メッセージをトリガーする任意のイベント名で braze.logCustomEvent を呼び出します。

Github   GitHub でこのページを編集
「このページはどの程度役に立ちましたか?」
New Stuff!