WebサイトでWebプッシュ通知を有効にすると、サイトの訪問者に通知サブスクリプションプロンプトが表示されるようになります。購読すると、このオーディエンスに通知をプッシュできるようになります。 「許可ボタン」をクリックして購読できます。

Webプッシュ通知はどのようにユーザーのデバイスに配信されますか？

Webプッシュ通知の配信に関与する3つのアクターと、高度な機能のための4番目のオプションのコンポーネントがあります。

プッシュ通知サービス：Chrome、Safari、Firefoxを含む各ブラウザには、独自の通知配信サービスがあります。 ChromeはGoogleCloud Messaging（現在はFirebase Cloud Messaging）を使用し、SafariはApple Push Notification Service（APNS）を使用し、FirefoxはMDNサーバーを使用します。
サービスワーカーの登録：開発者は、ブラウザーでサービスワーカーを登録する必要があります。これはChromeとFirefox専用です。 Safariはサービスワーカーをサポートしていません。
ユーザーのサブスクリプションID：サブスクライバーIDは、ユーザーが特定のWebサイトからの通知の受信をオプトインしたときに生成されます。
さらに、SDK（OSクライアントライブラリソフトウェア開発キット）をWebアプリに追加して、セグメンテーションおよび分析機能を拡張できます。

あなたのウェブサイトでウェブプッシュ通知を設定する方法は？

パブリッシャーは、ChromeおよびFirefoxブラウザー用のService Workerを実装し、Safariブラウザー用のAPN証明書を生成することから始めることができます。
ブラウザは、ドメインのユーザーサブスクリプション権限を読み取り、訪問者に通知の同意を求めるための標準API呼び出しを提供します。
パブリッシャーはさらにiZootoなどのサービスプロバイダーを使用し、SDKを使用して最初の2つのステップを処理できます。
パブリッシャーは、ブラウザープッシュシステムによって提供されるAPIを実行することにより、オーディエンスにWebプッシュ通知を送信できます。これは、UIを介して実行することもできます。

ユーザーサブスクリプションとアクティベーション

ユーザーは、デフォルトのブラウザープロンプトを使用してWebサイトにアクセスするたびに、通知サブスクリプションの入力を求められます。開発者とWebサイトの所有者は、条件付きでサブスクリプションプロンプトをトリガーすることを選択できます。この記事で、Android上のChromeの権限プロンプトの変更について詳しく説明します。
通知をサブスクライブするすべてのユーザーに対して、ブラウザーによって一意の登録キーが生成されます。
通知サービスプロバイダーは、サブスクライバーを一意に識別するために、追加のデータポイントとともにキーを最後に保存します。