Javascript swPrecache和CDN作为代理？

我正在使用swPrecache加载PWA的静态资产，以支持脱机模式。它工作得很好。我的设置类似于：

加载static index.html，然后使用swPrecache加载静态资产，如JS、图像、CSS等。请注意，这些都是从同一个域加载的，例如www.myexampledomain.com/myapp/JS/file1.JS

但我的swprecache列表有相当数量的文件，在较慢的互联网连接上下载需要一些时间。仅供参考，我已经将服务人员注册延迟到类似“加载”事件的时间

这就是我现在正在尝试的。我需要有人验证这是否可行：

像以前一样加载静态html文件

swPrecache是否拦截了进入应用程序域（例如）的静态请求，并将其获取到CDN端点？（例如）

一旦下载，swPrecache将继续正常工作

因此，本质上我希望swPrecache将静态资产请求代理到CDN，以便在初始加载期间更快地下载

对此的任何评论/建议都会有所帮助

您可以使用in

sw precache

更改写入服务工作者文件的URL。不过，这是相当残酷的，因此，如果有一个公共前缀由CDN提供服务的所有资产共享，这会有所帮助

例如，如果CDN之外的所有服务都存储在本地

assets/

目录中，那么它们在CDN上的路径将以

https://my-cdn.com/assets/

，您可以使用

{
  stripPrefixMulti: {'assets/': 'https://my-cdn.com/assets/'},
  // ... other sw-precache options...
}

您需要确保，当本地文件作为构建过程的一部分发生更改时，CDN上的文件副本也会立即更改，否则您将面临为本地文件生成的版本控制信息与CDN上的内容不同步的风险。

是的，您可以使用

{
   stripPrefixMulti: {'assets/': 'https://my-cdn.com/assets/'},
   // ... other sw-precache options...
 }

---

但我相信你会面临新的CORS问题。我也在努力

我试过这个，但对我不起作用。我对stripPrefix/stripPrefixMulti的理解是：在构建期间，当创建service-worker.js时，它会剥离指定的前缀，并用替换字符串替换它。我正在寻找的是一种方法来指定一个可以用来请求/获取URL的域。查看service-worker.js，相当于：

var request=new request（cacheKey.replace（self.location.hostname，“my cdn.com”），{credentials:'same origin'}。如果我手动修改服务人员，这似乎是可行的。我做错什么了吗？当您尝试
stripPrefixMulti
时发生了什么？这是使用
sw precache
最接近您的用例的地方。某些资产的CDN用例是一个潜在的雷区，因为您的同一来源
sw.js
文件和您的远程来源资产必须在两个不同的步骤中部署，任何不完整或延迟的部署都可能导致过时内容被无限期缓存。所以这不是我真正想让它变得“容易”的东西。