html - 如何在 PWA 服务工作者中缓存带有通配符的路由？

Question

我正在尝试将我的应用程序转换为 PWA，并且我知道我需要向服务人员提供端点和静态文件的完整列表，以便它可以管理缓存。在我找到的所有示例中，页面都是静态链接，例如/report. 但在大多数现实世界的应用程序中，页面包含动态部分，例如/report/{reportId:int}. 你如何告诉服务工作者这样一个端点？

标签： htmlprogressive-web-apps

Answer 1

您可以使用 javascript test() 方法并检查 url 是否与适合您的 url 的 regExp 表达式匹配。

您可以在此官方指南中阅读： https ://developers.google.com/web/fundamentals/instant-and-offline/offline-cookbook#putting_it_together

提炼：

if (/^\/article\//.test(requestURL.pathname)) {
    event.respondWith(/* some other combination of patterns */);
    return;
}