使用绝对URL

Question

我的网站https://example.com上有一个服务工作者（用于缓存资源），范围 / app-1 。

example.com
- /images/image.jpg
- /css/style.css
- /app1

我从文档中了解到，服务工作者无法访问../images/image.jpg或../css/style.css，因为它只能访问范围的子路径。

我大胆地向我的服务工作者添加了绝对路径以便缓存：

var urlsToPrefetch = [
 './',
 'https://example.com/css/style.css',
 'https://example.com/images/image.jpg'
];

以某种方式工作，现在缓存存储显示：

https://example.com/app1
https://example.com/images/image.jpg
https://example.com/css/style.css

究竟应该是什么。没有任何错误。

任何人都可以确认这种方法是可以接受的并解释原因（考虑范围限制）。

Answer 1

Serivce Worker Scope的真正含义在这里引起了一些混乱。它用于指定您希望服务工作者控制而不是获取的内容子集。

由于Service Worker安装在范围内的页面上，因此完全能够获取URL中的资源并缓存它们。唯一的问题是，如果超出范围的任何这些资源是您希望讨论的页面，则不会在该页面上安装服务工作者，因此您最好计划这种功能损失。

最后一点是，如果将Service Worker文件放在项目的根目录下，则应用程序源的所有内容都将在范围内。因此，如果将Service Worker文件放在根目录下，那么“/images/image.jpg”将在范围内。