blob: fb150dc92577b0977955d65d90d064e6c4d67a74 (
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
|
---
title: ServiceWorkerContainer.register()
slug: Web/API/ServiceWorkerContainer/register
tags:
- ServiceWorkerContainer.register()
translation_of: Web/API/ServiceWorkerContainer/register
---
<p>{{SeeCompatTable}}{{APIRef("Service Workers API")}}</p>
<p>{{domxref("ServiceWorkerContainer")}} 接口的 <strong><code>register()<font face="Open Sans, Arial, sans-serif"> </font></code></strong>方法创建或更新一个给定scriptURL的<code><a href="https://developer.mozilla.org/en-US/docs/Web/API/ServiceWorkerRegistration" title="The ServiceWorkerRegistion interface of the ServiceWorker API represents the service worker registration. You register a service worker to control one or more pages that share the same origin.">ServiceWorkerRegistration</a> </code>。</p>
<p>如果成功，一个服务工作者注册将提供的脚本URL与一个范围进行关联，后者用于导航匹配。如果该方法无法返回一个 <code>ServiceWorkerRegistration</code>，则返回一个 <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise" title="The Promise object is used for deferred and asynchronous computations. A Promise is in one of the three states:"><code>Promise</code></a>。</p>
<p>您可以从受控页无条件调用此方法, 即, 您不需要首先检查是否有一个有效的注册。</p>
<h2 id="语法">语法</h2>
<pre class="brush: js">ServiceWorkerContainer.register(scriptURL, options)
.then(
function(ServiceWorkerRegistration) {
// do something
}
);</pre>
<h3 id="参数">参数</h3>
<dl>
<dt><code>scriptURL</code></dt>
<dd>service worker脚本的URL.</dd>
<dt><code>options</code> <code>{{optional_inline}}</code></dt>
<dd>注册时提供选项的配置对象。 目前可用的选项包括：
<ul>
<li><code>scope</code>: 一个 {{domxref("USVString")}}，表示定义service worker注册范围的URL ；service worker可以控制的URL范围。通常是相对URL。默认值是基于当前的location，并以此来解析传入的路径.</li>
</ul>
</dd>
</dl>
<h3 id="返回">返回</h3>
<p>返回一个 {{domxref("Promise")}} 对象， 值是 {{domxref("ServiceWorkerRegistration")}} .</p>
<h2 id="示例">示例</h2>
<pre class="brush: js">if ('serviceWorker' in navigator) {
navigator.serviceWorker.register('service-worker.js', {scope: './'})
.then(function(registration) {
document.querySelector('#status').textContent = 'succeeded';
}).catch(function(error) {
document.querySelector('#status').textContent = error;
});
} else {
// The current browser doesn't support service workers.
let aElement = document.createElement('a');
aElement.href = `
http://www.chromium.org/blink/serviceworker/service-worker-faq
`;
aElement.textContent = 'unavailable';
document.querySelector('#status').appendChild(aElement);
}</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', '#service-worker-container', 'ServiceWorkerContainer')}}</td>
<td>{{Spec2('Service Workers')}}</td>
<td>Initial definition.</td>
</tr>
</tbody>
</table>
<h2 id="浏览器兼容性">浏览器兼容性</h2>
{{Compat("api.ServiceWorkerContainer.register")}}
|
