IBM Cloud Docs
Event Notificationsを使用して、FirefoxWebにプッシュ通知を作成および送信する

Event Notificationsを使用して、FirefoxWebにプッシュ通知を作成および送信する

Event Notifications サービスを作成し、Firefox のプッシュ宛先を追加し、Firefox Web デバイスにメッセージを送信します。

Event Notifications とは何ですか?

Event Notificationsは、IBM Cloudアカウントで発生した重要なイベントを通知したり、Webhookを使用して自動化されたアクションをトリガするイベント通知ルーティングサービスです。 You can filter and route event notifications from IBM Cloud services like Availability Monitoring, to email, SMS, push notifications, and webhooks.

クライアントは Firefox Web プッシュ通知をどのように使用しますか?

次の図は、クライアントが Firefox Web プッシュ通知を使用する方法を示しています。

クライアントはプッシュ
ように利用しているか

目標

このチュートリアルでは、以下のようにプッシュ通知を送信する方法について説明します。

  • Event Notifications を使用して Web サイトを作成します。
  • Firefox Web 資格情報を取得します。
  • SDK をダウンロードし、通知のセットアップを完了します。
  • Firefox Web プッシュ通知を構成してブラウザーに送信します。

Event Notifications サービス・インスタンスの作成

  • IBM Cloudアカウント にログインします。
  • IBM Cloudカタログ で、'Event Notifications > Event Notifications を検索する。
  • サポートされるリージョンのリストからRegionを選択し、pricing planを選択します。
  • Service nameを提供します。
  • resource groupを選択します。
  • チェック・ボックスをクリックして、ご使用条件と条件に同意します。
  • Create をクリックします。

汎用 API ソースの追加

次のステップを実行します。

  • Event Notifications ダッシュボードのSourcesセクションに移動します。
  • Addをクリックし、API ソースを選択します。
  • 名前とオプションの説明を入力し、Addをクリックします。

Event Notifications 宛先の作成

Event Notifications コンソールでDestinationsをクリックし、以下の宛先詳細を追加します。

  • Name: 宛先の名前を追加します。
  • Description: 宛先の説明 (オプション) を追加します。
  • Type: ドロップダウンリストから'Firefox Push Notifications タイプを選択する。
  • 宛先計画 (実動前宛先または実動宛先) を選択します。
    • Pre-production destination-開発環境およびテスト環境用の低コストのプッシュ宛先としてこの宛先を選択します。
    • Production destination-この宛先の全機能を使用します。 デバイスと送信メッセージは無制限。
  • Web サイトの URL を指定します。
  • 追加 をクリックします。
  • Firefox 宛先が作成された後。 作成した保存先を編集して、web sdkに必要な'public vapId key を取得します。

配信先編集*配信
*受信通知
受信通知

Destination
Receive notifications

Event Notifications トピックの作成

Event Notifications コンソールでTopicsを選択し、Createをクリックします。 以下のトピックの詳細を入力します。

  • Name: トピックの名前を入力します。
  • Description: トピックのオプションの説明を追加します。
  • Source: ドロップダウン・リストからソースを選択します。
  • Event type: ドロップダウン・リストからイベント・タイプを選択します。
  • Event sub type: イベント・サブタイプ・ドロップダウン・リストからイベント・サブタイプを選択します。
  • Severity: 重大度ドロップダウン・リストから重大度を選択します。
  • Advanced conditions: 独自のカスタム条件を作成します。jsonpath の指定に従う必要があります。

Event Notifications サブスクリプションの作成

Event Notifications コンソールでSubscriptionsをクリックします。 以下のサブスクリプションの詳細を入力します。

  • Clickをクリックして、サブスクリプション・ウィザードを表示します。
  • 以下のサブスクリプションの詳細を入力します。
    • Subscription name: サブスクリプションの名前。
    • Subscription description: オプションの説明を追加します。
  • Subscribe to a topicセクションの下で、ドロップダウン・リストからトピックを選択し、宛先ドロップダウン・リストから宛先を選択します。
  • Destination type: Destinationの下でタイプを選択し、Addをクリックします。

Event Notifications Firefox Web SDK のセットアップ

Firefox Web SDK は、Firefox Web サイトがプッシュ通知を受信できるようにします。 Event Notifications Firefox Web SDK をインストールし、SDK を初期化し、Web サイトの通知を登録するには、以下の手順を実行します。

  • SDK をプロジェクトに組み込むには、ENPushSDK.jsファイル、ENPushServiceWorker.jsファイル、およびmanifest_Website.jsonファイルをプロジェクトのルート・フォルダーに追加します。

  • manifest_Website.json ファイルを編集します。

    {
       "name": "YOUR_WEBSITE_NAME"
    }
    
  • manifest_Website.json ファイル名を manifest.json に変更します。

  • htmlファイルの'<head> タグに'manifest.json を含める。

    <link rel="manifest" href="https://github.com/IBM/event-notifications-destination-webpush-sdk/blob/main/manifest_Website.json">
    
  • スクリプトにIBM CloudウェブプッシュSDKを含める。

    <script src="https://github.com/IBM/event-notifications-destination-webpush-sdk/blob/main/ENPushSDK.js" async></script>
    
  • 以下の手順を完了し、ウェブサイトがSDKを初期化できるようにします。

    var enPush = new ENPush()
    
    function callback(response) {
       alert(response.response)
    }
    
    var initParams = {
       "instanceGUID": "<instance_guid>",
       "apikey": "<instance_apikey>",
       "region": "<region>",
       "deviceId": "<YOUR_DEVICE_ID>",
       "firefoxDestinationId": "<firefox_destination_id>",
       "firefoxApplicationServerKey": "<Firefox_VapId_public_key>"
    }
    
    enPush.initialize(initParams, callback)
    
    • region: Event Notifications インスタンスのリージョン。 例: us-southeu-gbau-sydeu-de および eu-es

    • deviceId: デバイス登録の場合はオプションの deviceId

  • 通知を登録するには、'register() または 'registerWithUserId() API を使用して、IBM Cloudサービスにデバイスを登録します。Event Notificationsサービスにデバイスを登録します。 次のいずれかのオプションを選択します。

    • UserIdなしで登録します。

      enPush.register(function(response) {
         alert(response.response)
      })
      
    • UserId で登録する。 userId ベースの通知では、registerメソッドはもう1つのパラメータ、'userId を受け入れます。

      bmsPush.registerWithUserId("UserId",function(response) {
         alert(response.response)
      })
      

      UserIdは、プッシュ・サービス・インスタンスにデバイスを登録する際に使用するユーザー ID 値です。

  • subscribe API は、タグのデバイスをサブスクライブします。 デバイスが特定のタグにサブスクライブすると、デバイスはそのタグについて送信された通知を受け取ることができます。 以下のコード・スニペットを Web アプリケーションに追加して、タグのリストをサブスクライブします。

    enPush.subscribe(tagName, function(response) {
       alert(response.response)
    })
    
  • セットアップが完了したら、アプリケーションを実行し、プッシュ通知に登録します。

Firefox デバイスへの通知の送信

通知送信 API を使用して、Firefox デバイスのプッシュ通知を送信します。 API を直接呼び出す代わりに、ノードまたは実行管理 SDK を使用できます。

通知を受け取る
を受け取る*
を受け取る