ServiceWorker | Web API

在此页

特性
方法
范例
规范
浏览器兼容性
另请参阅
相关话题

ServiceWorker 接口在服务工作者 API provides a reference to a service worker. Multiple 浏览上下文 (e.g. pages, workers, etc.) can be associated with the same service worker, each through a unique ServiceWorker 对象。

A ServiceWorker object is available in the ServiceWorkerRegistration.active property, and the ServiceWorkerContainer.controller property — this is a service worker that has been activated and is controlling the page (the service worker has been successfully registered, and the controlled page has been reloaded.)

ServiceWorker interface is dispatched a set of lifecycle events — 安装 and activate — and functional events including fetch 。 ServiceWorker object has an associated ServiceWorker.state , related to its lifecycle.

特性

ServiceWorker interface inherits properties from its parent, Worker .

ServiceWorker.scriptURL 只读: 返回 ServiceWorker serialized script URL defined as part of ServiceWorkerRegistration . The URL must be on the same origin as the document that registers the ServiceWorker .
ServiceWorker.state 只读: Returns the state of the service worker. It returns one of the following values: installing , installed, activating , activated ，或 redundant .

事件处理程序

ServiceWorker.onstatechange 只读: EventListener property called whenever an event of type statechange is fired; it is basically fired anytime the ServiceWorker.state 改变。

方法

ServiceWorker interface inherits methods from its parent, Worker ，除了 Worker.terminate — this should not be accessible from service workers.

范例

This code snippet is from the service worker registration-events sample ( live demo ). The code listens for any change in the ServiceWorker.state and returns its value.

if ('serviceWorker' in navigator) {
    navigator.serviceWorker.register('service-worker.js', {
        scope: './'
    }).then(function (registration) {
        var serviceWorker;
        if (registration.installing) {
            serviceWorker = registration.installing;
            document.querySelector('#kind').textContent = 'installing';
        } else if (registration.waiting) {
            serviceWorker = registration.waiting;
            document.querySelector('#kind').textContent = 'waiting';
        } else if (registration.active) {
            serviceWorker = registration.active;
            document.querySelector('#kind').textContent = 'active';
        }
        if (serviceWorker) {
            // logState(serviceWorker.state);
            serviceWorker.addEventListener('statechange', function (e) {
                // logState(e.target.state);
            });
        }
    }).catch (function (error) {
        // Something went wrong during registration. The service-worker.js file
        // might be unavailable or contain a syntax error.
    });
} else {
    // The current browser doesn't support service workers.
}

规范

规范	状态	注释
服务工作者 The definition of 'ServiceWorker' in that specification.	工作草案	初始定义。

浏览器兼容性

The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out https://github.com/mdn/browser-compat-data and send us a pull request. 更新 GitHub 上的兼容性数据

	桌面						移动
	Chrome	Edge	Firefox	Internet Explorer	Opera	Safari	Android webview	Chrome for Android	Firefox for Android	Opera for Android	Safari on iOS	Samsung Internet
`ServiceWorker`	Chrome 40	Edge 17 17 16 Disabled Disabled From version 16: this feature is behind the `Enable service workers` preference.	Firefox 44 注意事项 44 注意事项 Extended Support Releases (ESR) before Firefox 78 ESR do not support service workers and the Push API.	IE 不支持 No	Opera 27	Safari 11.1	WebView Android 40	Chrome Android 40	Firefox Android 44	Opera Android 27	Safari iOS 11.3	Samsung Internet Android 4.0
`onstatechange`	Chrome 40	Edge 17 17 16 Disabled Disabled From version 16: this feature is behind the `Enable service workers` preference.	Firefox 44 注意事项 44 注意事项 Extended Support Releases (ESR) before Firefox 78 ESR do not support service workers and the Push API.	IE 不支持 No	Opera 27	Safari 11.1	WebView Android 40	Chrome Android 40	Firefox Android 44	Opera Android 27	Safari iOS 11.3	Samsung Internet Android 4.0
`scriptURL`	Chrome 40	Edge 17 17 16 Disabled Disabled From version 16: this feature is behind the `Enable service workers` preference.	Firefox 44 注意事项 44 注意事项 Extended Support Releases (ESR) before Firefox 78 ESR do not support service workers and the Push API.	IE 不支持 No	Opera 27	Safari 11.1	WebView Android 40	Chrome Android 40	Firefox Android 44	Opera Android 27	Safari iOS 11.3	Samsung Internet Android 4.0
`state`	Chrome 40	Edge 17 17 16 Disabled Disabled From version 16: this feature is behind the `Enable service workers` preference.	Firefox 44 注意事项 44 注意事项 Extended Support Releases (ESR) before Firefox 78 ESR do not support service workers and the Push API.	IE 不支持 No	Opera 27	Safari 11.1	WebView Android 40	Chrome Android 40	Firefox Android 44	Opera Android 27	Safari iOS 11.3	Samsung Internet Android 4.0

图例

完整支持
不支持
实验。期望将来行为有所改变。

用户必须明确启用此特征。

另请参阅

元数据

最后修改： Aug 26, 2020

在此页

特性

事件处理程序

方法

范例

规范

浏览器兼容性

图例

另请参阅

相关话题