blob: 8fcadb8f44c0648c9dbcbb90f70d2beaaaea3cfc (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
|
---
title: InstallEvent
slug: Web/API/InstallEvent
translation_of: Web/API/InstallEvent
---
<div>{{APIRef("Service Workers API")}}{{SeeCompatTable}}</div>
<p>该参数传递到 {{domxref("ServiceWorkerGlobalScope.oninstall", "oninstall")}} 事件处理程序，<code>InstallEvent接口表示一个 </code>{{domxref("ServiceWorker")}}<code> </code>的 {{domxref("ServiceWorkerGlobalScope")}} 上分派的安装操作。作为 {{domxref("ExtendableEvent")}} 的一个子类，它确保在安装期间不调度诸如 {{domxref("FetchEvent")}} 之类的功能事件。</p>
<p>该接口继承自 {{domxref("ExtendableEvent")}} 接口。</p>
<p>{{InheritanceDiagram(700, 60, 20)}}</p>
<h2 id="构造函数">构造函数</h2>
<dl>
<dt>{{domxref("InstallEvent.InstallEvent()")}}</dt>
<dd>创建一个新的<code>InstallEvent对象。</code></dd>
</dl>
<h2 id="属性">属性</h2>
<p><em>从它的祖先{{domxref("Event")}}继承属性。</em></p>
<dl>
<dt>{{domxref("InstallEvent.activeWorker")}} {{readonlyInline}}</dt>
<dd>返回当前处于激活状态，控制页面的{{domxref("ServiceWorker")}}。</dd>
</dl>
<h2 id="方法">方法</h2>
<p><em>从它的父类{{domxref("ExtendableEvent")}}继承方法。</em></p>
<h2 id="示例">示例</h2>
<p>该代码片段来自 <a href="https://github.com/GoogleChrome/samples/blob/gh-pages/service-worker/prefetch/service-worker.js">service worker prefetch sample</a> (请参阅 <a href="https://googlechrome.github.io/samples/service-worker/prefetch/">prefetch running live</a>)。代码在{{domxref("ServiceWorkerGlobalScope.oninstall")}}中调用{{domxref("ExtendableEvent.waitUntil", "ExtendableEvent.waitUntil(any value)")}}，并延迟将{{domxref("ServiceWorkerRegistration.installing")}} worker视为已安装的，直到传递的promise被成功地resolve。当所有资源已经获取并缓存，或者有任何异常发生时，promise才会resolve。</p>
<p>该代码片段也展示了服务工作线程使用的缓存版本控制的最佳实践。虽然此示例只有一个缓存，但您可以将此方法用于多个缓存。 代码将缓存的速记标识映射到特定的版本化缓存名称。</p>
<div class="note">
<p><strong>注意</strong>: service worker的注册日志记录在Chrome浏览器中可以通过访问chrome://serviceworker-internals查看。</p>
</div>
<pre class="brush: js">var CACHE_VERSION = 1;
var CURRENT_CACHES = {
prefetch: 'prefetch-cache-v' + CACHE_VERSION
};
self.addEventListener('install', function(event) {
var urlsToPrefetch = [
'./static/pre_fetched.txt',
'./static/pre_fetched.html',
'https://www.chromium.org/_/rsrc/1302286216006/config/customLogo.gif'
];
console.log('Handling install event. Resources to pre-fetch:', urlsToPrefetch);
event.waitUntil(
caches.open(CURRENT_CACHES['prefetch']).then(function(cache) {
cache.addAll(urlsToPrefetch.map(function(urlToPrefetch) {
return new Request(urlToPrefetch, {mode: 'no-cors'});
})).then(function() {
console.log('All resources have been fetched and cached.');
});
}).catch(function(error) {
console.error('Pre-fetching failed:', error);
})
);
});</pre>
<h2 id="规范">规范</h2>
<table class="standard-table">
<tbody>
<tr>
<th scope="col">Specification</th>
<th scope="col">Status</th>
<th scope="col">Comment</th>
</tr>
<tr>
<td>{{SpecName('Service Workers')}}</td>
<td>{{Spec2('Service Workers')}}</td>
<td>As of May 2015, the install event is an instance of {{domxref("ExtendableEvent")}} rather than a child of it.</td>
</tr>
</tbody>
</table>
<h2 id="浏览器兼容性">浏览器兼容性</h2>
<div>{{CompatibilityTable}}</div>
<div id="compat-desktop">
<table class="compat-table">
<tbody>
<tr>
<th>Feature</th>
<th>Chrome</th>
<th>Firefox (Gecko)</th>
<th>Internet Explorer</th>
<th>Opera</th>
<th>Safari (WebKit)</th>
</tr>
<tr>
<td>Basic support</td>
<td>{{CompatChrome(40.0)}}</td>
<td>{{CompatGeckoDesktop("44.0")}}<sup>[1]</sup></td>
<td>{{CompatNo}}</td>
<td>24</td>
<td>{{CompatNo}}</td>
</tr>
</tbody>
</table>
</div>
<div id="compat-mobile">
<table class="compat-table">
<tbody>
<tr>
<th>Feature</th>
<th>Android</th>
<th>Firefox Mobile (Gecko)</th>
<th>Firefox OS</th>
<th>IE Mobile</th>
<th>Opera Mobile</th>
<th>Safari Mobile</th>
<th>Chrome for Android</th>
</tr>
<tr>
<td>Basic support</td>
<td>{{CompatUnknown}}</td>
<td>{{CompatGeckoMobile("44.0")}}</td>
<td>{{CompatVersionUnknown}}</td>
<td>{{CompatNo}}</td>
<td>{{CompatUnknown}}</td>
<td>{{CompatNo}}</td>
<td>{{CompatChrome(40.0)}}</td>
</tr>
</tbody>
</table>
</div>
<p>[1] Service workers (and <a href="/en-US/docs/Web/API/Push_API">Push</a>) have been disabled in the <a href="https://www.mozilla.org/en-US/firefox/organizations/">Firefox 45 and 52 Extended Support Releases</a> (ESR.)</p>
<h2 id="参见">参见</h2>
<ul>
<li>{{domxref("NotificationEvent")}}</li>
<li>{{jsxref("Promise")}}</li>
<li><a href="/en-US/docs/Web/API/Fetch_API">Fetch API</a></li>
</ul>
|
