问题标签 [workbox]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
workbox - 使用 Workbox 缓存来自域的所有查询字符串结果
我正在尝试从 sw-toolbox 移动到 Workbox,我需要做的一件事是缓存来自不同服务器上的 API url 的所有查询字符串结果,我尝试了一些代码,但我没有任何成功了。
这是我最近的尝试:
顺便说一句,我试过不带“(。*)”。
sharepoint - 根据查询字符串过期workboxjs缓存项目
我使用 Workbox 在我的 sharepoint 项目中预缓存和缓存资源。ms sharepoint 使用了很多我希望缓存的开箱即用的 js / css。
Sharepoint 为 js、css 呈现 src 标签,并在查询字符串中附加一个修订 ID。像这样的东西:
我想根据修订 (rev) 查询字符串使这些资源过期。这可以通过workbox js中的任何开箱即用的东西来完成,还是我需要一个自定义插件之类的东西?
你能指出我的文档/示例吗?
先感谢您
progressive-web-apps - WorkboxSW 构造函数抛出错误未定义
在我的服务工作者文件中,我正在使用以下代码:
但我收到错误,Uncaught ReferenceError: WorkboxSW is not defined
因此我的服务人员没有注册。
progressive-web-apps - 如何使工作箱缓存跨源响应?
根据workbox doc,应配置跨域请求以确保正则表达式与 URL 的开头匹配。但是,它不起作用。
服务工作者代码如下所示。
在页面中,来自同源资源的响应被缓存,但来自https://a248.e.akami.net
的响应不被缓存。
我的配置有什么问题吗?或者这是一个工作箱 3.0.0 错误?
offline - 在“已安装”(添加到主屏幕)PWA 中更新 Workbox 控制的预缓存项目
我正在使用 Workbox 2 来处理我的 PWA 的“离线”行为。内容由HexoJS 生成并部署到 GitHub Pages。以下是workbox-cli-config.js
供参考:
一切都按预期工作,应用程序正确处理切换到 Chrome DevTools 中的离线模式。
当我更新一些静态内容(例如 HTML)并将其重新部署到 GitHub 页面上时,就会出现问题--- 我可以看到内容的更新版本,但并非总是如此,而且并非在所有浏览器中都如此。
我总是必须在 Opera 或 Chrome(或其他浏览器)中使用“清除浏览数据”操作来刷新页面的外观,因为简单的“刷新/重新加载”没有帮助。
“添加到主屏幕”PWA 的问题变得更加严重。即使通过卸载/重新安装,我也无法强制刷新内容。仅擦除 Android Chrome 浏览器中的浏览数据有助于刷新应用内容。
我的问题是:
- 当我重新访问页面或刷新已安装的 PWA 时,是否可以让预缓存的静态资产自动更新?
- 我是否以错误的方式配置 Workbox(见我
workbox-cli-config.js
上面的) - 迁移到 Workbox 3 会有什么不同吗?
如果这有助于解决问题,我很乐意分享其他配置文件。
PS:该页面在 Lighthouse 中的得分为 100,除了性能之外的所有标准(因为加载了阻塞内容,bootstrap.min.js
但在 SO 中读取,这是可以的)。
service-worker - 工作箱 3 中的 workbox.runtimeCaching.Handler?
我已经在工作箱 2 中实现了这个类,现在我已经升级到版本 3,但不推荐使用 workbox.runtimeCaching.Handler。
有人可以帮助我如何在工作箱 3 中开发它吗?*
webpack - 工作箱 webpack 插件 workbox.precaching.prod.js 从错误的文件夹加载
我正在使用带有 webpack v3.11 的工作箱 webpack 插件 v3.01。
我的 webpack 构建将 index.html 输出到 wwwroot 文件夹中,该文件夹是 src 的兄弟。捆绑包位于 wwwwroot/dist 文件夹中。因此,为了缓存 index.html,我需要将 service worker 输出到 wwwroot。部署时,我显然不希望对 wwwroot 进行任何引用。
Webpack 输出配置:
工作箱配置:
除插件外,一切正常。在生成的 sw.js 中,我看到了问题:
所以 workbox-sw.js 文件是从正确的位置导入的。但是,modulePathPrefix 不正确。我相信如果 modulePathPrefix 包含 /dist/ 它将起作用。
我发现了一个类似的 github 问题(它是用于清单注入而不是 GenerateSW),它表明 webpack 输出部分中配置的 publicPath 存在问题。
我一直在尝试各种配置更改,这些更改当然都是相互关联的。我希望我能以某种方式指定正确的 modulePathPrefix。
caching - Workbox:self.skipWaiting() 的危险
我使用 Workbox 预缓存渲染应用程序外壳所需的资产,包括基本版本的index.html
. Workbox 假定它index.html
在缓存中可用,否则,页面导航将失败,因为我已在我的 Service Worker 中注册了它:
self.skipWaiting()
我在安装侦听器中也有说明:
据我了解,现在有 2 个install
听众:
- Workbox 为预缓存资产注册的一个(包括 index.html)
- 我在我的 Service Worker 中手动注册的一个
self.skipWaiting()
Workbox 的安装侦听器失败时是否有可能成功?这将导致一个有问题的状态,即资产没有被预缓存但服务工作者被激活。这种情况是否可能,我应该防范吗?
webpack - Workbox 插件不考虑 output.publicPath 来加载 serviceworker 文件
我正在使用具有以下配置的 workbox-webpack-plugin。
这可以正确构建。但问题是加载sw.js
文件。我有一个自定义路径(https://test.com/custom/),而不是直接指向域(https://test.com)。构建后,sw.js 尝试加载的路径是通过https://test.com/sw.js而不是我的整个应用程序构建所在的https://test.com/custom/sw.js 。这也是我output.publicPath
的 webpack 中提到的路径。如何在 Workbox 插件配置中进行设置?我正在使用"3.0.0-beta.2"
版本。