PWA - 为不同的 seo 友好 url 缓存和加载相同的 appshell

Question

我们是消费者互联网，拥有 SEO 友好的网址：www.xyz.com/user-1、www.xyz.com/user-2、www.xyz.com/user-n。从技术上讲，这些都是具有不同 url 的用户页面。对于所有这些情况，我们只需要加载一个 html 文件（app-shell）。

我想要实现的是：

1. 进入 www.xyz.com/user-1 页面，缓存 html (app-shell) 文件。
2. 导航到 www.xyz.com/user-2 页面，从 www.xyz.com/user-1 的缓存中获取 html 响应（因为它是同一个 app-shell）。

我无法做到这一点，因为缓存 api 的“匹配”方法适用于 url 请求对象，我无法操作它。有没有办法可以操纵 url 请求对象？或者有解决办法吗？

Answer 1

您可以根据需要创建自己的回复。但是，我认为您正在描述经典的 SPA 架构。在那里，您将拥有一个应用程序外壳，并通过在浏览器中呈现标记或从服务器附加预呈现的标记来填充客户端的主要内容区域。 您可能想查看 sw 模板策略作为一个可能的起点 -> https://jakearchibald.com/2014/offline-cookbook/#serviceworker-side-templating