问题标签 [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.
laravel - Workbox: cannot cache all files when build project
I use Vuejs
and I use workbox-webpack-plugin
in order to make my site offline, I want to cache a folder which contains all my files (3 files) like picture below, but when I build my project(using Laravel-mix
). The main.js
(which contains everything of Vue) cannot be cached in service-woker.js
. I tried some ways to fix that but those didn't work.
Does anybody face this issue, do you have any solution, many thanks!
javascript - 如何对 workboxSW 预缓存项目使用 staleWhileRevalidate?
workboxSW.precache
默认是cacheFirst,有没有办法改变它的策略?
或者有没有办法在预缓存项上定义缓存名称,因此可以通过指定路由来覆盖预缓存项?
visual-studio - 从 Google 的 sw-toolbox 迁移到 Workbox SW (Visual Studio)
我曾经sw-toolbox
用于管理我的服务人员 - 小、简单、有效。现在谷歌已经发布Workbox SW
(它取代了 sw-toolbox 和 sw-precache)我需要迁移,但我正在努力寻找:
a) Workbox 的单个 .js 依赖项,我可以将其包含在我的项目中
b) 用于构建单个 .js 依赖项的自定义构建工具
c) 在我的项目构建中包含 Workbox 构建的方法
我会以错误的方式解决这个问题吗?
javascript - Workbox,staleWhileRevalidate 在图像上仅调用一次
我正在开发 PWA,我正在尝试使用工作箱来管理服务人员和资产缓存。
在我的 PWA 中,如果设备在线,我必须显示所有较新的图像,如果没有,则显示缓存中的图像。
当我尝试实现它时,我看到图像上的 staleWhileRevalidate 方法在每个图像的页面中只调用一次,如果我尝试多次刷新也是如此。我需要关闭网页,当我重新打开它时,图像会正确更新。它以这种方式工作是正常的吗?
当我使用 localhost 尝试时,每次重新加载页面时都会调用 staleWhileRevalidate,但是当我在远程服务器上加载网站时,应用程序不再以这种方式工作。
service-worker.js
:
index.html
:
javascript - 使用工作箱运行时缓存,请求不会显示在 chrome 上的缓存存储中
我正在使用工作箱运行时缓存来缓存外部调用(materialize.css 就是其中之一)。在我的网络选项卡中,它显示请求来自 serviceWorker(看起来不错):
但是在缓存存储上,我的运行时缓存看起来是空的:
您可以在 chrome 的应用程序选项卡上看到我的服务人员,这是网站:https ://quack.surge.sh/
服务工作者代码:
这是预期的行为吗?我对服务人员很陌生,我不确定正确的结果是什么。
javascript - ServiceWorker 离线 - HTML 中没有类名
我一直在尝试使用 Workbox 在我的 React 16 项目中实现缓存。它似乎正在缓存某些东西,因为页面仍在offline
模式下呈现。但我似乎无法弄清楚,为什么我的缓存版本不包含元素上的任何类名。
我已经通过 Webpack 使用以下代码块实现了 Workbox:
这可能是什么原因?图像也没有被加载,即使也应该被缓存。
编辑:
似乎.js
没有加载文件。main
&文件包含分配类名所需的vendor
.js
内容。
如您所见,.js
找不到文件。这是在 a 中preload
,但删除它们只会将错误转移到<script />
包含文件。此外,服务工作者注册的位置似乎并不重要。
旁注:我的类名是通过使用生成的import styles from './index.scss'
=>
<div className={styles.container} />
workbox - 如何缓存较大的文件以进行开发
我正在玩工作箱,但出现以下错误:
Skipping file 'app.js' due to size. [Max size supported is 2097152, this file is 4760833]
我理解为什么它会在生产中这样做,这在生产中不是问题,因为我的 app.js 文件被缩小并且远低于该限制。
但是如何生成一个可以在开发中使用的服务工作者,包括这些更大的文件?
workbox - 如果网络在 Service Worker 缓存更新时出现故障,我会阻塞 PWA 吗?
假设您在更新 PWA 期间,网络中断并且刷新缓存失败。这会让应用程序处于什么状态?刷新时是否会更新某些应用程序文件而其他则不会?当连接返回时,它会重试吗?多常?多少次?
caching - 在 service worker 中使用 self.clients.claim() 和 self.skipWaiting() 可能会增加加载时间?
在阅读了许多教程之后,我发现self.skipWaiting()
它用于立即将更新应用到现有的 serviceWorker,并self.clients.claim()
用于在第一次加载时立即控制。
它是在每个请求上查找更新还是在内部如何工作?使用对负载或服务人员self.clients.claim()
的self.skipWaiting()
性能有何影响?