From 33058f2b292b3a581333bdfb21b8f671898c5060 Mon Sep 17 00:00:00 2001 From: Peter Bengtsson Date: Tue, 8 Dec 2020 14:40:17 -0500 Subject: initial commit --- .../web/api/serviceworker/onstatechange/index.html | 123 +++++++++++++++++++++ 1 file changed, 123 insertions(+) create mode 100644 files/zh-cn/web/api/serviceworker/onstatechange/index.html (limited to 'files/zh-cn/web/api/serviceworker/onstatechange') diff --git a/files/zh-cn/web/api/serviceworker/onstatechange/index.html b/files/zh-cn/web/api/serviceworker/onstatechange/index.html new file mode 100644 index 0000000000..1ac245dfd4 --- /dev/null +++ b/files/zh-cn/web/api/serviceworker/onstatechange/index.html @@ -0,0 +1,123 @@ +--- +title: ServiceWorker.onstatechange +slug: Web/API/ServiceWorker/onstatechange +translation_of: Web/API/ServiceWorker/onstatechange +--- +
{{SeeCompatTable}}{{APIRef("Service Workers API")}}
+ +

一个 {{domxref("EventListener")}} 联动的属性，其会被任何stagechange类型事件抛出时联动; 它也基本上能在任何时候{{domxref("ServiceWorker.state")}} 改变时被抛出.

+ +

语法

+ +
ServiceWorker.onstatechange = function(statechangeevent) { ... }
+ServiceWorker.addEventListener('statechange', function(statechangeevent) { ... } )
+ +

示例

+ +

这段代码出自 service worker registration-events sample (live demo). 它会监听 {{domxref("ServiceWorker.state")}} 的改变并返回它的值.

+ +
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);
+  });
+}
+ +

注意当statechange 抛出时, service worker的引用可能已经改变。例如:

+ +
navigator.serviceWorker.register(..).then(function(swr) {
+  swr.installing.state == "installing"
+  swr.installing.onstatechange = function() {
+    swr.installing == null;
+    // At this point, swr.waiting OR swr.active might be true. This is because the statechange
+    // event gets queued, meanwhile the underlying worker may have gone into the waiting
+    // state and will be immediately activated if possible.
+  }
+})
+ +

规范

+ + + + + + + + + + + + + + +
规范状态附注
{{SpecName('Service Workers', '#service-worker-onstatechange-attribute', 'ServiceWorker.onstatechange')}}{{Spec2('Service Workers')}}Initial definition
+ +

浏览器兼容性

+ +
{{CompatibilityTable}}
+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari (WebKit)
Basic support{{CompatChrome(40.0)}}{{ CompatGeckoDesktop("44.0") }}[1]{{CompatNo}}24{{CompatNo}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidAndroid WebviewFirefox Mobile (Gecko)Firefox OSIE MobileOpera MobileSafari MobileChrome for Android
Basic support{{CompatNo}}{{CompatNo}}{{ CompatGeckoMobile("44.0") }}{{ CompatVersionUnknown }}{{CompatNo}}{{CompatUnknown}}{{CompatNo}}{{CompatChrome(40.0)}}
+
+ +

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

-- cgit v1.2.3-54-g00ecf