ServiceWorkerGlobalScope
は ServiceWorker API のインターフェイスで、サービスワーカーのグローバル実行コンテキストを表します。
開発者は ServiceWorker の状態が停止/再起動サイクルをまたいで続かないことを心にとめておいてください。このため各イベントハンドラーは、むき出しの、デフォルトのグローバル状態で実行されることを想定すべきです。
いったん正しく登録されたら、サービスワーカーはメモリーとプロセッサーの力を温存するため、アイドル時であれば停止させることができます。アクティブなサービスワーカーはイベント、例えば ServiceWorkerGlobalScope.onfetch
や ServiceWorkerGlobalScope.onmessage
に応じて自動的に再起動します。
加えて、同期リクエストはサービスワーカーでは許可されていません— 非同期リクエスト、つまりfetch()
メソッド経由で初期化されたものが使われます。
このインターフェイスは WorkerGlobalScope
インターフェイスと、その親の EventTarget
を継承し、このため WindowTimers
, WindowBase64
, WindowEventHandlers
のプロパティを実装しています。
<div id="interfaceDiagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 12.142857142857142%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-20 0 700 85" preserveAspectRatio="xMinYMin meet"><a xlink:href="https://developer.mozilla.org/ja/docs/Web/API/EventTarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#D4DDE4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="Consolas,Monaco,Andale Mono,monospace" fill="#4D4E53" text-anchor="middle" alignment-baseline="middle">EventTarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#D4DDE4" fill="none"/><line x1="121" y1="25" x2="151" y2="25" stroke="#D4DDE4"/><a xlink:href="https://developer.mozilla.org/ja/docs/Web/API/WorkerGlobalScope" target="_top"><rect x="151" y="1" width="170" height="50" fill="#fff" stroke="#D4DDE4" stroke-width="2px" /><text x="236" y="30" font-size="12px" font-family="Consolas,Monaco,Andale Mono,monospace" fill="#4D4E53" text-anchor="middle" alignment-baseline="middle">WorkerGlobalScope</text></a><polyline points="321,25 331,20 331,30 321,25" stroke="#D4DDE4" fill="none"/><line x1="331" y1="25" x2="361" y2="25" stroke="#D4DDE4"/><a xlink:href="https://developer.mozilla.org/ja/docs/Web/API/ServiceWorkerGlobalScope" target="_top"><rect x="361" y="1" width="240" height="50" fill="#F4F7F8" stroke="#D4DDE4" stroke-width="2px" /><text x="481" y="30" font-size="12px" font-family="Consolas,Monaco,Andale Mono,monospace" fill="#4D4E53" text-anchor="middle" alignment-baseline="middle">ServiceWorkerGlobalScope</text></a></svg></div>
a:hover text { fill: #0095DD; pointer-events: all;}
プロパティ
ServiceWorkerGlobalScope.clients
読取専用- サービスワーカーに関連する
Clients
オブジェクトを含む。 ServiceWorkerGlobalScope.registration
読取専用- サービスワーカーの登録を表す
ServiceWorkerRegistration
オブジェクトを含む。 ServiceWorkerGlobalScope.caches
読取専用- サービスワーカーに関連する
CacheStorage
オブジェクトを含む。
イベント
activate
ServiceWorkerRegistration
が新しいServiceWorkerRegistration.active
ワーカーを得た時に発生します。
ServiceWorkerGlobalScope.onactivate
プロパティからも利用できます。fetch
fetch()
が呼び出されたときに発生します。
ServiceWorkerGlobalScope.onfetch
プロパティからも利用できます。install
ServiceWorkerRegistration
が新しいServiceWorkerRegistration.installing
ワーカーを得た時に発生します。
ServiceWorkerGlobalScope.oninstall
プロパティからも利用できます。message
- メッセージを受信したときに発生します。制御中のページは
MessagePort.postMessage()
メソッドを使用してサービスワーカーにメッセージを送信することができます。サービスワーカーは任意でevent.data.port
で公開されているMessagePort
を通じて、対応する制御中のページに返信することができます。
ServiceWorkerGlobalScope.onmessage
プロパティからも利用できます。 notificationclick
- 表示された通知をユーザーがクリックしたときに発生します。
ServiceWorkerGlobalScope.onnotificationclick
プロパティからも利用できます。 notificationclose
- 表示された通知をユーザーが閉じたときに発生します。
ServiceWorkerGlobalScope.onnotificationclose
プロパティからも利用できます。 push
- サーバーのプッシュ通知が届いたときに発生します。
ServiceWorkerGlobalScope.onpush
プロパティからも利用できます。 pushsubscriptionchange
- プッシュ通知への加入が無効化されたとき、または無効化されようとするとき (例えば、プッシュ通知の有効期限が設定されたとき) に発生します。
ServiceWorkerGlobalScope.onpushsubscriptionchange
プロパティからも利用できます。 sync
- サービスワーカーのクライアントページから
SyncManager.register
への呼び出しが行われたときに発生します。ネットワークが有効であるか、すぐに利用可能になるのであれば、直ちに同期が試みられます。
ServiceWorkerGlobalScope.onsync
プロパティからも利用できます。
メソッド
ServiceWorkerGlobalScope.skipWaiting()
- 現在のサービスワーカーの登録を、待ち状態からクライアントが使っている時のアクティブ状態に進めます。
ServiceWorkerGlobalScope
は WorkerGlobalScope
を実装します — これは GlobalFetch
を実装します。このため利用できる次のプロパティも持っています:
GlobalFetch.fetch()
- リソース取得(fetch)のプロセスを開始します。これはリクエストのレスポンスを表す
Response
オブジェクトを解決するpromiseを返します。このアルゴリズムは service worker コンテキストに渡されるfetch処理のエントリーポイントです。
例
このコードスニペットは、service worker prefetch sample(prefetch example live を参照してください)からのものです。ServiceWorkerGlobalScope.onfetch
イベントハンドラーは fetch
イベントを監視します。イベントが発火した時、コードは Cache
オブジェクト内で、最初にマッチングしたリクエストに対して解決するプロミスを返します。もし、何もマッチしなかった場合は、コードはネットワークからのレスポンスをフェッチします。
さらに、このコードは fetch()
演算から投げられた例外をハンドリングします。 HTTP のエラーレスポンス (たとえば、404) は、例外を引き起こさないことにご注意ください。適切なエラーコードセットを持った通常のレスポンスオブジェクトを返します。
self.addEventListener('fetch', function(event) {
console.log('Handling fetch event for', event.request.url);
event.respondWith(
caches.match(event.request).then(function(response) {
if (response) {
console.log('Found response in cache:', response);
return response;
}
console.log('No response found in cache. About to fetch from network...');
return fetch(event.request).then(function(response) {
console.log('Response from network is:', response);
return response;
}, function(error) {
console.error('Fetching failed:', error);
throw error;
});
})
);
});
仕様書
仕様書 | 状態 | 備考 |
---|---|---|
Service Workers ServiceWorkerGlobalScope の定義 |
草案 | 初回定義 |
ブラウザーの互換性
BCD tables only load in the browser