不支持 service worker 的 Cache Busting
Cache Busting where service worker is not supported
我正在使用 sw-precache 和 sw-toolbox 来管理我的服务工作者。假设我有一个要缓存的 css 文件
staticFileGlobs: ['public/asset/build/css/m_index.min.css']
它作为
添加到 运行 gulp 任务的服务工作者
var precacheConfig = [["public/asset/build/css/m_college.min.css","8d9b0e69820ba2fab83c45e2884bd61f"]
文件的哈希值帮助我在注册 Service Worker 时清除缓存。一切正常。
现在考虑这样一种情况，某个 PC 或用户或浏览器无法注册 Service Worker，并且文件每次都通过网络提供给他。在这种情况下，文件将存储在浏览器内存中，因为默认情况下没有缓存破坏。即使在开发人员更新文件后，它也可能将旧文件终生提供给该用户。
如何处理这种情况？
对于寻找答案的任何人，有一个简单的解决方案 - COOKIES。
在尝试注册 cookie 时，如果出现问题，请设置 cookie。这个 cookie 可以在发送文件之前在后端读取
如果未设置 cookie，则在没有缓存破坏的情况下加载文件，否则在末尾附加一个缓存破坏器以防止浏览器在没有服务工作者的地方缓存 运行。
因为 cookie 是唯一可以在前端和后端直接访问的东西。
我会使用 Etag 响应 header (https://developer.mozilla.org/en/docs/Web/HTTP/Headers/ETag) 来避免为用户加载过时的资产。
我正在使用 sw-precache 和 sw-toolbox 来管理我的服务工作者。假设我有一个要缓存的 css 文件
staticFileGlobs: ['public/asset/build/css/m_index.min.css']
它作为
添加到 运行 gulp 任务的服务工作者var precacheConfig = [["public/asset/build/css/m_college.min.css","8d9b0e69820ba2fab83c45e2884bd61f"]
文件的哈希值帮助我在注册 Service Worker 时清除缓存。一切正常。
现在考虑这样一种情况，某个 PC 或用户或浏览器无法注册 Service Worker，并且文件每次都通过网络提供给他。在这种情况下，文件将存储在浏览器内存中，因为默认情况下没有缓存破坏。即使在开发人员更新文件后，它也可能将旧文件终生提供给该用户。
如何处理这种情况？
对于寻找答案的任何人，有一个简单的解决方案 - COOKIES。
在尝试注册 cookie 时，如果出现问题，请设置 cookie。这个 cookie 可以在发送文件之前在后端读取 如果未设置 cookie，则在没有缓存破坏的情况下加载文件，否则在末尾附加一个缓存破坏器以防止浏览器在没有服务工作者的地方缓存 运行。
因为 cookie 是唯一可以在前端和后端直接访问的东西。
我会使用 Etag 响应 header (https://developer.mozilla.org/en/docs/Web/HTTP/Headers/ETag) 来避免为用户加载过时的资产。