ServiceWorkerRegistration.showNotification()
showNotification()
は ServiceWorkerRegistration
インターフェイスのメソッドで、アクティブなサービスワーカー上で通知を作成します。
メモ: この機能はウェブワーカーで利用できます。
構文
showNotification(title)
showNotification(title, options)
引数
title
-
通知内に表示する必要があるタイトル
options
省略可-
通知の設定を可能にするオブジェクト。 次のプロパティを持つことができます。
actions
Experimental-
通知に表示するアクションの配列。 配列のメンバーはオブジェクトリテラルである必要があります。 次の値が含まれる場合があります。
適切なレスポンスは、
event.action
をnotificationclick
イベントで使用することで作成されます。 badge
Experimental-
文字列で、Android の通知バーなど、通知自体を表示するのに十分なスペースがない場合に通知を表す画像の URL が入ります。Android 端末では、バッジは最大 4 倍の解像度、約 96 x 96 ピクセルの端末に対応する必要があり、画像は自動的にマスクされます。
body
-
通知内に表示する追加のコンテンツを表す文字列。
data
Experimental-
通知に関連付ける任意のデータ。 これは任意のデータ型にすることができます。
dir
-
通知の方向。
auto
、ltr
、rtl
のいずれかです。 icon
-
通知でアイコンとして使用される画像の URL を含む文字列。
image
Experimental-
通知に表示される画像の URL を含む文字列。
lang
-
通知内で使用される言語を指定します。 この文字列は、RFC 5646: 言語識別子のタグ (BCP 47 とも呼ばれる)に基づく有効なものである必要があります。
renotify
Experimental-
論理値で、
tag
値を再利用するときにバイブレーションと可聴アラートを抑制するかどうかを示します。 オプションのrenotify
がtrue
で、オプションのtag
が空の文字列の場合、TypeError が発生します。既定値はfalse
です。 requireInteraction
Experimental-
画面が十分に大きい端末では、ユーザーがクリックするか閉じるまで通知をアクティブにしておく必要があることを示します。 この値がないか
false
の場合、デスクトップ版の Chrome は約 20 秒後に通知を自動的に最小化します。既定値はfalse
です。 silent
-
設定されている場合、音やバイブレーションは発生しないことを示します。オプションの
silent
がtrue
で、オプションのvibrate
が存在する場合、TypeError 例外が発生します。既定値はfalse
です。 tag
-
必要に応じてスクリプトを使用して通知を検索、置換、または削除できるようにする所与の通知の ID です。
timestamp
-
この通知に関連付けられた時刻で、ミリ秒単位のUnix 時刻で表されるタイムスタンプです。これは過去に、端末がオフラインだったためにすぐに配信できなかったメッセージに通知が使用された場合や、これから始まる会議に向けて通知が使用された場合などです。
vibrate
Experimental-
通知の表示で実行するバイブレーションパターン。 バイブレーションパターンは、メンバーが 1 つしかない配列にすることができます。 値はミリ秒単位の時間で、偶数のインデックス(0、2、4 など)は振動する時間を示し、奇数のインデックスは一時停止する時間を示します。例えば、
[300, 100, 400]
は、 300 ミリ秒振動し、 100 ミリ秒休止してから、 400 ミリ秒振動します。
返値
undefined
に解決するプロミス (Promise
) です。
例
navigator.serviceWorker.register("sw.js");
function showNotification() {
Notification.requestPermission((result) => {
if (result === "granted") {
navigator.serviceWorker.ready.then((registration) => {
registration.showNotification("バイブレーションの例", {
body: "ブンブン! ブンブン!",
icon: "../images/touch/chrome-touch-icon-192x192.png",
vibrate: [200, 100, 200, 100, 200, 100, 200],
tag: "vibration-sample",
});
});
}
});
}
上記の関数を適切なタイミングで呼び出すには、onnotificationclick
イベントハンドラーが使用できます。
現在のサービスワーカーから発生した Notification
の詳細は、 ServiceWorkerRegistration.getNotifications()
を使用して取得することもできます。
仕様書
Specification |
---|
Notifications API Standard # dom-serviceworkerregistration-shownotification |
ブラウザーの互換性
BCD tables only load in the browser