1

我正在使用 swPrecache 来加载我的 PWA 的静态资产，以支持离线模式。它工作得很好。我的设置是这样的：

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

但是我的 swprecache 列表有相当数量的文件，并且在较慢的互联网连接上需要一些时间来下载。仅供参考，我已经将服务工作者注册延迟到“加载”事件之类的东西。

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

  1. https://www.myexampledomain.com/myapp/像以前一样加载静态 html 文件。
  2. 是否让 swPrecache 拦截到应用程序域的静态请求（例如https://www.myexampledomain.com/myapp/js/file1.js），然后将这些请求提取到 CDN 端点？（例如https://some.cloudfront.com/myapp/js/file1.js）。
  3. 下载后，swPrecache 将继续照常工作。

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

对此的任何评论/指示都会有所帮助。

4

2 回答 2

1

您可以使用instripPrefixMulti选项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 上的内容同步。

于 2017-05-04T21:00:40.827 回答
0

是的，你可以使用

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

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

于 2017-07-03T06:08:30.647 回答