ServiceWorkerContainer

ServiceWorkerContainer接口为 service worker提供一个容器般的功能，包括对service worker的注册，卸载 ，更新和访问service worker的状态，以及他们的注册者

主要是ServiceWorkerContainer.register(scriptURL, scope[, base])提供一个注册service worker的方法，ServiceWorkerContainer.controller将获取当前控制页面网络的service worker

属性

ServiceWorkerContainer.controller 只读

当ServiceWorker对象的state是active的时候，返回一个 ServiceWorker 对象 和ServiceWorkerRegistration.active)返回相同的对象。 如果当前的state都不是active或者强制刷新浏览器则返回null。

ServiceWorkerContainer.ready 只读

定义了一个serviceWorker是否准备好为一个页面服务，将返回一个 Promise，并且这个 Promise永远不会 reject,这个 Promise会在ServiceWorkerRegistration 获取到一个active的ServiceWorker的时候被解决。

 

事件

ServiceWorkerContainer.oncontrollerchange

在ServiceWorkerRegistration获取到一个新的active的ServiceWorker对象的时候被触发

ServiceWorkerContainer.onerror

当service workers中出现错误的时候被触发

ServiceWorkerContainer.onmessage

当ServiceWorkerContainer  对象接受到一个message消息的时候被触发,message由MessagePort.postMessage()发出

方法

ServiceWorkerContainer.register() 

创建或者更新一个ServiceWorkerRegistration 用给定的scriptURL

ServiceWorkerContainer.getRegistration()

根据当前网页的URL与当前service worker的scope Url的匹配，返回一个 ServiceWorkerRegistration对象,如果不能返回一个 ServiceWorkerRegistration,则返回一个Promise。

ServiceWorkerContainer.getRegistrations()

返回所有的ServiceWorkerRegistration对象，如果不能返回一个 ServiceWorkerRegistration,则返回一个Promise。

举例

代码是service worker fallback-response sample (see fallback-response live)的其中一段. 首先检查浏览器是否支持serviceWorker. 代码创建了一个serviceWorker，并且打印出来当前页面的serviceWorker的是否接管了页面的网络状态. 如果没有需要刷新页面再次查看.  代码也处理了注册失败的情况

if ('serviceWorker' in navigator) {
  navigator.serviceWorker.register('service-worker.js', {scope: './'}).then(function() {
    if (navigator.serviceWorker.controller) {
      document.querySelector('#status').textContent = 'The service worker is currently handling network operations.';
      showRequestButtons();
    } else {
      document.querySelector('#status').textContent = 'Please reload this page to allow the service worker to handle network operations.';
    }
  }).catch(function(error) {
    document.querySelector('#status').textContent = error;
  });
} else {
  var aElement = document.createElement('a');
  aElement.href = 'http://www.chromium.org/blink/serviceworker/service-worker-faq';
  aElement.textContent = 'unavailable';
  document.querySelector('#status').appendChild(aElement);
}

Specifications

Browser compatibility

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

See also

• Using Service Workers
• Service workers basic code example
• Is ServiceWorker ready?
• Promise
• Using web workers