We're looking for a user researcher to understand the needs of developers and designers. Is this you or someone you know? Check out the post: https://mzl.la/2IGzdXS

この翻訳は不完全です。英語から この記事を翻訳 してください。

ServiceWorker APIServiceWorkerGlobalScope インターフェイスは service worker のグローバル実行コンテキストを表します。

開発者は ServiceWorker の状態が停止/再起動サイクルをまたいで続かないことを心にとめておいてください。このため各イベントハンドラーは、むき出しの、デフォルトのグローバル状態で実行されることを想定すべきです。

いったん正しく登録されたら、service worker はメモリーとプロセッサーの力を温存するため、アイドル時であれば停止させることができます。アクティブな service worker はイベント、例えばServiceWorkerGlobalScope.onfetchServiceWorkerGlobalScope.onmessage に応じて自動的に再起動します。

加えて、同期リクエストは service worker では許可されていません— 非同期リクエスト、つまりfetch() メソッド経由で初期化されたものが使われます。

このインターフェイスは WorkerGlobalScope インターフェイスと、その親の EventTarget を継承し、このため WindowTimers, WindowBase64, WindowEventHandlers のプロパティを実装しています。


ServiceWorkerGlobalScope.clients 読取専用
Service worker に関連する Clients オブジェクトを含む。
ServiceWorkerGlobalScope.registration 読取専用
Service worker の登録を表す ServiceWorkerRegistration オブジェクトを含む。
ServiceWorkerGlobalScope.caches 読取専用
Service worker に関連する CacheStorage オブジェクトを含む。


An event handler fired whenever an activate event occurs — when a ServiceWorkerRegistration acquires a new ServiceWorkerRegistration.active worker.
An event handler fired whenever a fetch event occurs — when a fetch() is called.
An event handler fired whenever an install event occurs — when a ServiceWorkerRegistration acquires a new ServiceWorkerRegistration.installing worker.
An event handler fired whenever a message event occurs — when incoming messages are received. Controlled pages can use the MessagePort.postMessage() method to send messages to service workers. The service worker can optionally send a response back via the MessagePort exposed in event.data.port, corresponding to the controlled page.
An event handler fired whenever a notificationclick event occurs — when a user clicks on a displayed notification.
An event handler fired whenever a notificationclose event occurs — when a user closes a displayed notification.
An event handler fired whenever a push event occurs — when a server push notification is received.
An event handler fired whenever a pushsubscriptionchange event occurs — when a push subscription has been invalidated, or is about to be invalidated (e.g. when a push service sets an expiration time.)
An event handler fired whenever a SyncEvent event occurs. This is triggered when a call to SyncManager.register is made from a service worker client page. The attempt to sync is made either immediately if the network is available or as soon as the network becomes available. 


現在の service worker 登録を、待ち状態からクライアントが使っている時のアクティブ状態に進めます。

ServiceWorkerGlobalScopeWorkerGlobalScope を実装します — これは GlobalFetch を実装します。このため利用できる次のプロパティも持っています:

リソース取得(fetch)のプロセスを開始します。これはリクエストのレスポンスを表す Response オブジェクトを解決するpromiseを返します。このアルゴリズムは service worker コンテキストに渡されるfetch処理のエントリーポイントです。

This code snippet is from the service worker prefetch sample (see prefetch example live.) The ServiceWorkerGlobalScope.onfetch event handler listens for the fetch event. When fired, the code returns a promise that resolves to the first matching request in the Cache object. If no match is found, the code fetches a response from the network.

The code also handles exceptions thrown from the fetch() operation. Note that an HTTP error response (e.g., 404) will not trigger an exception. It will return a normal response object that has the appropriate error code set.

self.addEventListener('fetch', function(event) {
  console.log('Handling fetch event for', event.request.url);

    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 の定義
草案 初期定義
Fetch の定義
現行の標準 Adds the fetch method.
Push API
onpush の定義
草案 Adds the onpush and onpushsubscriptionchange event handlers.
Notifications API
onnotificationclick の定義
現行の標準 Adds the onnotificationclick event handler.
Web Background Synchronization
onsync の定義
現行の標準 Adds the onsync event.


機能ChromeEdgeFirefoxInternet ExplorerOperaSafari
基本対応40 ?441 なし24 なし
clients40 ?441 なし24 なし
registration40 ?441 なし24 なし
caches40 ?441 なし24 なし
onactivate40 ?441 なし24 なし
onfetch40 ?441 なし24 なし
oninstall40 ?441 なし24 なし
onmessage40 ?441 なし24 なし
onnotificationclick40 ?421 なし24 なし
onnotificationclose40 ?441 なし24 なし
onpush40 ?441 なし24 なし
onpushsubscriptionchange40 ?441 なし24 なし
onsync49 ?441 なし24 なし
skipWaiting40 ?441 なし24 なし
onmessageerror ? ? ? ? ? ?
機能Android webviewChrome for AndroidEdge mobileFirefox for AndroidOpera AndroidiOS SafariSamsung Internet
基本対応4040 ?4424 なし4.0
clients4040 ?4424 なし4.0
registration4040 ?4424 なし4.0
caches4040 ?4424 なし4.0
onactivate4040 ?4424 なし4.0
onfetch4040 ?4424 なし4.0
oninstall4040 ?4424 なし4.0
onmessage4040 ?4424 なし4.0
onnotificationclick4040 ?4224 なし4.0
onnotificationclose4040 ?4424 なし4.0
onpush4040 ?4424 なし4.0
onpushsubscriptionchange4040 ?4424 なし4.0
onsync4949 ?4424 なし5.0
skipWaiting4040 ?4424 なし4.0
onmessageerror ? ? ? ? ? ? ?

1. Service workers (and Push) have been disabled in the Firefox 45 and 52 Extended Support Releases (ESR).



このページの貢献者: Uemmra3, chrisdavidmills
最終更新者: Uemmra3,