このページは Cloud Translation API によって翻訳されました。

通知トリガー API

通知トリガーを使用すると、ネットワーク接続を必要としないローカル通知をスケジュールできるため、カレンダーアプリなどのユースケースに最適です。

Thomas Steiner

通知トリガーとは

ウェブデベロッパーは、 Web Notifications API。この機能は通常、 Push API を使用して、次のような時間的制約のある情報をユーザーに通知します。受信メッセージなどがあります通知は、ページ上で JavaScript を実行することで表示されます。アクセスします。

Push API の問題は、通知のトリガーが信頼性に欠けることです。特定の条件（時間や場所など）に一致した場合に表示できます時間ベースの condition は、上司との重要な会議についてリマインドするカレンダー通知です。午後 2 時ロケーションベースの条件の例として、牛乳を買うように促す通知がある。ネットワーク接続またはバッテリー保持 Doze モードのような機能により、プッシュ通知の配信が遅れる可能性があります。

通知トリガーを使用することで、通知をスケジュール設定できるため、この問題を解決できます。オペレーティングシステムが適切なタイミングで通知を配信できるようにし、。

ユースケース

カレンダーアプリケーションで時間ベースの通知トリガーを使用して、今後の予定をユーザーに知らせることができる説明しました。カレンダーアプリのデフォルトの通知スキームでは、最初のヘッドアップ通知が表示される可能性があります。会議の 1 時間前に通知し、さらに 5 分前に別の緊急通知を送信するおすすめします

お気に入りのテレビ番組がまもなく始まることや会議がライブ中であることを、テレビネットワークがユーザーに知らせます。ストリーミングが開始します。

タイムゾーン変換サイトでは、時間ベースの通知トリガーを使用して、ユーザーにスケジュールを設定できる電話会議やビデオ通話のアラーム

現在のステータス

ステップ	ステータス
1. 説明を作成	完了
2. 仕様の初期ドラフトを作成する	開始していません
3. フィードバックを収集し、設計を繰り返す。	作成中
4. オリジントライアル	完了
5. リリース	開始していません

通知トリガーの使用方法

about://flags から有効にする

オリジントライアルトークンを使用せずに Notification Triggers API をローカルでテストするには、 about://flags の #enable-experimental-web-platform-features フラグ。

機能検出

ブラウザが通知トリガーをサポートしているかどうかを確認するには、 showTrigger プロパティ:

if ('showTrigger' in Notification.prototype) {
  /* Notification Triggers supported */
}

通知のスケジュールを設定する

通知のスケジュール設定は、通常のプッシュ通知の表示と似ていますが、ユーザーが次の設定を行う必要がある点が異なります。 TimestampTrigger オブジェクトを値として含む showTrigger 条件プロパティを通知の options オブジェクト。

const createScheduledNotification = async (tag, title, timestamp) => {
  const registration = await navigator.serviceWorker.getRegistration();
  registration.showNotification(title, {
    tag: tag,
    body: 'This notification was scheduled 30 seconds ago',
    showTrigger: new TimestampTrigger(timestamp + 30 * 1000),
  });
};

スケジュール設定された通知をキャンセルする

スケジュール設定された通知をキャンセルするには、まず、特定の条件に一致するすべての通知のリストをリクエストします。 ServiceWorkerRegistration.getNotifications() でタグ付けします。なお、スケジュール設定された通知をリストに含めるための includeTriggered フラグ:

const cancelScheduledNotification = async (tag) => {
  const registration = await navigator.serviceWorker.getRegistration();
  const notifications = await registration.getNotifications({
    tag: tag,
    includeTriggered: true,
  });
  notifications.forEach((notification) => notification.close());
};

デバッグ

Chrome DevTools の [通知] パネルを使用して通知をデバッグできます。開始方法 [Start recording events] を押します。または Ctrl+E キー（Mac では command+E キー）を押します。Chrome DevTools のレコードスケジュール設定された通知、表示した通知、終了した通知など、3 日間のすべての通知イベント kube-APIserver に送信します。

スケジュール設定された通知イベントが、[Application] パネルにある Chrome DevTools の [Notifications] ペインに記録されました。 — </ph> スケジュール設定された通知。

表示された通知イベントが Chrome DevTools の [通知] ペインに記録されました。 — </ph> 表示される通知。

デモ

デモでは通知トリガーの実際の動作を確認できます。このデモでは、通知のトリガーのスケジュールを設定できます。スケジュール設定された通知の一覧表示、キャンセルを行うことができます。ソースコードはグリッチ。

セキュリティと権限

Chrome チームは、基本原則に基づいて Notification Triggers API を設計、実装しました。強力なウェブプラットフォーム機能へのアクセスの制御で定義されている制御、透明性、エルゴノミクスの点で優れています。この API には Service Worker が必要なため、保護します。API を使用するには、通常のプッシュ通知と同じ権限が必要です。

ユーザーコントロール

この API は、ServiceWorkerRegistration のコンテキストでのみ使用できます。これは、すべての Pod が必要なデータは、同じコンテキストに保存され、Service Worker の起動時にユーザーがオリジンのすべてのサイトデータを削除した場合。Cookie をブロックするとワーカーが Chrome にインストールされなくなるため、この API が使用されなくなります。通知はサイトの設定でユーザーが常に無効にしている。

透明性

Push API とは異なり、この API はネットワークに依存しないため、通知がスケジュールされます。 badge、icon、 image 属性。つまり、デベロッパーはスケジュール設定された通知を表示できません。ユーザーが通知を操作するまで Service Worker を復帰させません。したがって、デベロッパーがユーザーに関する情報を取得する方法は知られていません。 IP アドレスの位置情報ルックアップなど、プライバシーを侵害する可能性のあるアプローチを使用する。この設計はオペレーティングシステムが提供するスケジュールメカニズムをオプションとして利用できます。 Android の AlarmManager など、バッテリーを節約します。

フィードバック

通知トリガーを使用した感想をお聞かせください。

API 設計について教えてください

API で想定どおりに機能していないものはありますか？あるいは不足しているメソッドがあるかアイデアを実現するために必要なものやプロパティは？セキュリティに関する質問またはコメントどうすればよいでしょうか。Notification Triggers GitHub リポジトリで仕様に関する問題を報告するか、解決します

実装に問題がある場合

Chrome の実装にバグは見つかりましたか？または、実装が仕様と異なっていますか？ new.crbug.com でバグを報告します。できるだけ詳細に説明してください簡単な再現手順を実行し、[Components] を UI>Notifications に設定します。Glitch が優れているをご覧ください。

API の使用をご計画の場合は、

サイトで通知トリガーを使用するご予定でしたら、皆様の公的なサポートは、Google が優先順位付けを行い、機能を確認し、他のブラウザベンダーがそれらの機能をサポートすることがいかに重要であるかを示しています。ツイートの送信先 @ChromiumDev（ハッシュタグを使用） #NotificationTriggers どこで、どのように使用されているかをお知らせください。

謝辞

通知トリガーは Richard Knoll によって実装されました。解説は、Peter Beverloo による表示されます。次のユーザーがこの記事をレビューしました。 Joe Medley、Pete LePage、 Richard と Peter。ヒーロー画像: Unsplash の Lukas Blazek。