在不同的域中加载远程Service Worker？

Question

我正在尝试在网站上放置一个Service Worker，并希望从CDN加载Service Worker脚本。然而，当我从不同的域加载Service Worker时，会出现以下错误。

ServiceWorker DOMException：无法注册ServiceWorker：提供的scriptURL（'https://cdndomain.com'）的源与当前源（'http://mydomain'）不匹配

有没有办法从CDN加载Service Worker？我看到一些推送通知服务在做这个，我们可以使用eval在本地执行service worker js吗？

有什么解决方法吗？谢谢

这是我的当前代码的样子

 if (navigator.serviceWorker) {
   console.log("ServiceWorkerssupported");

   navigator.serviceWorker.register('https://cdn.com/sw.js', {
     scope: './'
   })
   .then(function(reg) {
     console.log("ServiceWorkerstered", reg);
   })
   .catch(function(error) {
     console.log("Failedegister ServiceWorker", error);
   });
}

- rksh

---

似乎这里有解决方案：https://dev59.com/C2Eh5IYBdhLWcg3w321G - Siniša

Answer 1

服务工作者必须来自同一域 - 因为服务工作者文件的位置非常重要。

if ('serviceWorker' in navigator) {
  navigator.serviceWorker.register('/sw.js').then(function(registration) {
    // Registration was successful
    console.log('ServiceWorker registration successful with scope: ',    registration.scope);
  }).catch(function(err) {
    // registration failed :(
    console.log('ServiceWorker registration failed: ', err);
  });
}

注册方法的一个细节是服务工作者文件的位置。在这种情况下，您会注意到服务工作者文件位于域的根目录。这意味着服务工作者的范围将是整个来源。换句话说，此服务工作者将接收此域上所有内容的获取事件。如果我们在/example/sw.js中注册服务工作者文件，则服务工作者只会看到URL以/example/开头的页面的获取事件（即/example/page1/，/example/page2/等）。

您可以使用php脚本作为代理从其他位置加载它。

- Charlie