简体   繁体   English

如何在Service_worker.js所在的目录上注册服务工作者的作用域

[英]How to register a service worker's scope one directory above where the service_worker.js is located

MY directories are as follows. 我的目录如下。

public_html/
sw/

The "sw/" is where I want to put all service workers, but then have those service workers with a scope to all the files in "public_html/". “sw /”是我想要放置所有服务工作者的地方,但是那些服务工作者的范围是“public_html /”中的所有文件。

JS JS

<script>
if ('serviceWorker' in navigator) {
  navigator.serviceWorker.register('sw/notifications.js', { scope: '../sw/' }).then(function(reg) {
    // registration worked
    console.log('Registration succeeded. Scope is ' + reg.scope);
  }).catch(function(error) {
    // registration failed
    console.log('Registration failed with ' + error);
  });
};
</script>

How do I allow this sort of scope? 我如何允许这种范围?

The max scope for a service worker is where it is located . 服务工作者最大范围是它所在的位置 This means you can not register one service worker located at /sw/ in scope: '/public_html/' unless you include a special header Service-Worker-Allowed set to the new max scope for your service worker. 这意味着您无法注册位于/sw/ scope: '/public_html/'一个服务工作者scope: '/public_html/'除非您为Service-Worker-Allowed添加了一个特殊的标题Service-Worker-Allowed设置为新的最大范围。

Summarizing, if you can add this header when serving the service worker, set it as follows: 总而言之,如果您可以在为服务工作者提供服务时添加此标头,请按如下所示进行设置:

Service-Worker-Allowed: /public_html/

If not, you must place the sw at some location above the scope. 如果没有,则必须将sw放在示波器上方的某个位置。

Edit: As Salva's answer indicates, the max scope must be widened with the Service-Worker-Allowed header to allow the following to succeed. 编辑:正如Salva的回答所示,必须使用Service-Worker-Allowed标头扩大最大范围,以允许以下成功。


Change the scope property of the registration options object (the second parameter of navigator.serviceWorker.register() ) to the URL you would like the service worker to be scoped to. 将注册选项对象的scope属性( navigator.serviceWorker.register()的第二个参数)更改为您希望将服务工作者限定为范围的URL。 In your case, this may be ../public_html . 在你的情况下,这可能是../public_html

// ...
navigator.serviceWorker.register('sw/notifications.js', { scope: '../public_html/' })
// ...

That parameter will default to ./ (relative to the ServiceWorker script) if the options object is not provided, or has no scope property. 如果未提供选项对​​象,或者没有scope属性,则该参数将默认为./ (相对于ServiceWorker脚本)。

Also, setting a scope with any origin other than the current origin will reject the registration Promise with a SecurityError exception. 此外,使用除当前原点之外的任何原点设置scope 将拒绝具有SecurityError异常的注册Promise。


References: 参考文献:

https://www.w3.org/TR/service-workers/#navigator-service-worker-register https://www.w3.org/TR/service-workers/#navigator-service-worker-register

https://developer.mozilla.org/en-US/docs/Web/API/ServiceWorkerContainer/register#Parameters https://developer.mozilla.org/en-US/docs/Web/API/ServiceWorkerContainer/register#Parameters

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM