反应脚本构建服务工作者不缓存自定义文件
我注意到由 react-scrips 构建生成的 Service Worker 不会缓存某些文件.这些文件包括(在我的项目中)公共文件夹中的自定义 css 文件和一些从其他服务器访问的文件(例如谷歌字体和引导 css 文件). 如何确保这些文件也被缓存? 非常感谢 编辑:所以 react 构建脚本会在/build 中生成 service-worker.js 文件.然而，生成的 S
..
service-worker相关内容
注册 ServiceWorker 失败:脚本具有不受支持的 MIME 类型 ('text/html') Vue js?
我想在我的 vue js 项目中包含 service worker，我之前在我的简单 HTML 项目中这样做过，它工作得非常好，但是当我将相同的文件包含到我的 vue js 代码中时，它不断抛出错误 脚本具有不受支持的 MIME 类型 ('text/html').index.js?3609:11 Service wroker: error: SecurityError: Failed to
..
如何使用 postMessage 将数据从 Firebase Service Worker 传递到 Angular 4 组件
如何将数据从 Service Worker 传递到 Angular 4 组件?是否可以使用角度服务来修复它?如何在 angular 4 中使用导航器和 PostMessage?请帮助我一步一步:) importScripts('https://www.gstatic.com/firebasejs/3.9.0/firebase-app.js');importScripts('https://www
..
重新加载后继续在页面上使用 getDisplayMedia 进行录制
我正在使用 navigator.mediaDevices.getDisplayMedia 在网页上录制我的屏幕.但是当我重新加载页面时，它停止了.我想自动继续录音.可能吗? 也许我可以以某种方式使用localstorage，重新加载的页面会尝试再次录制，但随后再次出现选择要录制的屏幕的提示，但我想像以前一样选择相同的屏幕进行自动录制，这样用户就不会在每次页面重新加载后受到打扰. 有什么
..
如果资源位于不同的域上，如何使用 service-worker?
我们知道 service worker 是从项目文件夹的根目录注册的，但是有没有办法从不同的域中获取一些静态资源(css、js)? 示例: myWebsite.com//主网址(例如 index.html) abc.com/css/style.css//css文件路径 xyz.com/js/jsFile.js//javascript文件路径 解决方案 任何来自页面的请求(i
..
使用 ReadableStream 和 Response 从 Service Worker 的 fetch 事件返回 HTML
我正在尝试在 Service Worker 中返回 HTML 响应的流，但浏览器似乎无法解析它(我在此测试中使用 chrome). 所以，这个有效(在 fetch 事件中): event.respondWith(new Response("
Yellow!
", { headers: { "Content-Type": "text/html"}})) 但是当我使用 Read
..
为什么浏览器在离线时加载 Service Worker 并导致“获取脚本时发生未知错误"?
我使用以下代码注册服务工作者: //如果浏览器支持 serviceWorker，而我们还没有注册任何 - 我们将注册我们的:sw.js ..if ('serviceWorker' in navigator && !navigator.serviceWorker.controller) {navigator.serviceWorker.register('/sw.js').then(functio
..
使用 Asynchronous ReadableStream with Response 从 Service Worker 的 fetch 事件返回 HTML
这个问题类似于我的另一个问题，但考虑到 ReadableStream 内部的异步性质. 这是我现在的测试代码: const stream = new ReadableStream({开始(c){让我 = 1const t = setInterval(test, 5e2)功能测试() {c.enqueue(" 黄色！ ")如果(我++ === 5){清除间隔(t)c.close()}}}})
..
如果 update() 不可用，则以编程方式更新 Service Worker
如何以编程方式更新 Service Worker 自 ServiceWorkerRegistration.update() 还没有在 Chrome 中实现吗?有没有替代品? 解决方案 我想你现在已经明白了，但我认为你想要 serviceWorker.skipWaiting()
..
对于 ServiceWorker cache.addAll()，URL 是如何工作的?
我看到很多这样的示例代码:(此 Mozilla 文档) this.addEventListener('install', function(event) {事件.等待直到(caches.open('v1').then(function(cache) {返回 cache.addAll(['/sw-测试/','/sw-test/index.html','/sw-test/style.css','/s
..
无法在“ServiceWorker"上执行“postMessage":无法克隆函数
我正在尝试向 Service Worker 实例发布消息.我收到以下错误: 未能在“ServiceWorker"上执行“postMessage":function (){obj.removeListener(ev, fn);} 无法克隆. 我的代码如下: var socket = io();函数 onYouTubeIframeAPIReady() {//告诉service worke
..
Angular 6 ServiceWorker - index.html 返回响应 404 Not Found
我已经在我的测试服务器上部署了 PWA https://www.mytestserver.me/dev/pwa/ 在“dev/pwa"文件夹下.该应用程序以 100% 的 PWA 分数通过了 Lighthouse.但是该应用程序仍然无法按预期运行.它根本不起作用.)) JS 控制台说: 无法加载'https://www.mytestserver.me/dev/pwa'.服务工作者向 Fetc
..
Service Worker 即时声明页面的最佳实践
由于应用程序和用户体验的性质，我目前设置了一个 Service Worker 来立即声明页面. 由于这个应用程序是从 AppCache 转换过来的，它为每个用户创建了一个动态 Manifest 文件，我发现最好的方法是将此 Manifest 文件解析为 JSON 数组并将其发送给 Service Worker 以便缓存它.问题是我需要等到 Service Worker 处于活动状态才能接收此
..
如何在本地主机中测试服务工作者离线模式?
如何在本地以离线模式测试 Service Worker?我的意思是，本地主机不需要互联网访问，所以它只是不断获取所有文件.我可以在 Firefox 或 Chrome 中以某种方式进行离线模拟，以便查看缓存失败或其他问题时会发生什么吗? 解决方案 在 Chrome 中，您可以在 DevTools 的 Application 选项卡中模拟离线，>Service Workers 面板.您会看到一
..
Service Worker 不从缓存中返回文件
我正在尝试使用 Service Worker 缓存单页 web 应用程序.它应该从缓存中获取它的所有文件，并仅在发布新的 Service Worker 版本时更新该缓存. 使用预缓存功能，我将一些文件写入缓存，如下所示: function precache() {返回 caches.open(CACHE).then(function(cache) {返回 cache.addAll(['in
..
如果页面在离线时加载/刷新，JavaScript 后台同步将停止工作
我目前正在学习如何使用后台同步，以允许用户在离线使用网络应用程序时进行 PUT/POST 更改. 我遵循了 Jake Archibald 在 中给出的说明引入后台同步，一切运行良好……只要我在在线加载网络应用程序时注册后台同步.我的意思是: 有效的步骤: 在线时我打开网络应用 我在网络标签中打开了离线模式 我点击了一些注册后台同步的按钮. 我关闭了离线模式，以便应用重新上线
..
Service Worker controllerchange 永远不会触发
我想在每次页面加载时向 Service Worker 发送一条消息. 页面第一次加载时调用 register()，然后在 navigator.serviceWorker 上监听“controllerchange"事件，但这永远不会触发. 我如何知道何时可以开始向 Service Worker 发送消息? navigator.serviceWorker.register(swURL).
..
Service Worker 与网页之间的通信
我正在开发一个应用程序，其目标是定期(例如每小时)向用户发送通知.我的想法是使用一个可以在选项卡关闭后运行的服务工作者，并继续向用户发送这些通知.网页需要能够与 Service Worker 沟通关于这些通知的具体细节、消息应该是什么、它应该以什么间隔运行等等. 我无法理解网页如何与现有的 Service Worker 通信，有没有办法让我在打开并设置网页后确定我是否已经有一个已注册的 Se
..
重新加载页面后 Service Worker 显示为已删除
我正在使用 react 并尝试实现 Service Worker，我编写了一个用于推送通知的微型 Service Worker 文件，当用户单击按钮时正在注册 Service Worker，现在如果我发送推送消息，它会按预期工作，但是当我重新加载页面时，即使注册成功，应用程序中的 Service Worker 仍显示为已删除，请参考截图 服务工作者代码 const self = this
..
如何在 Service Worker 中动态加载 Javascript 文件?
我不能使用任何涉及动态创建 标签的解决方案，因为 document 不存在于 ServiceWorker 上下文中. 在这种情况下，我想加载分析工具包，以便我可以跟踪用户何时与软件触发的通知进行交互. 有什么想法吗? 解决方案 这听起来像是 importScripts() 方法. 导入的脚本与您的服务工作者共享全局范围，因此通过例如 self.addEventListen
..