问题标签 [service-worker]

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.

0 投票
1 回答
5885 浏览

javascript - 在 https iframe 中注册服务工作者时出现 DOMException

我正在尝试在 http(不安全)站点内的 https iframe 中注册服务人员。直到最近,我的代码运行没有任何问题。从上次 chrome 更新 (44) 开始,此代码在 iframe 内失败:

我在控制台中收到此错误: Uncaught (in promise) DOMException: Only secure origins are allowed

如果安全 iframe 在不安全的父级中运行,是否有任何更改阻止安全 iframe 注册服务人员?

0 投票
1 回答
1264 浏览

google-chrome - 如何告诉 Service Worker 缓存哪些文件

我在做什么

我正在构建一个 Service Worker 组件。我希望它有:

  • 包含 Service Worker 实现的单个 worker.js 文件。
  • 我希望能够告诉工作人员要缓存哪些文件,以及缓存的名称。
    • 为什么?我想在几个项目中需要这个模块,我不希望他们中的任何一个修改工作文件。工作人员应该能够接收到缓存路径列表。

我试过的

  • 我尝试将配置对象传递给 register 方法,但它不起作用。工人没有收到物品。
  • 利用worker上可用的postMessage API,我这样做了:
    1. 在工人的注册中,我向工人发送了一条消息,其中包含一个带有要缓存的路由的对象。
    2. 在 worker 内部,我已经为 worker 订阅了这条消息并使用路径来创建缓存。

亲眼看看

主线程中worker的注册

工人档案

这有什么问题?

我不得不使用 setTimeout 来延迟打开缓存,这是错误的、丑陋的和不可靠的。

你想达到什么目的,伙计?ಠ_ಠ</h3>

我想找到一种方法来告诉工作人员等到包含缓存路径的消息到达。

链接到我的回购

提前致谢。

0 投票
1 回答
1264 浏览

javascript - 为什么服务工作者会导致每一秒的 jquery 帖子立即停止?

我在标题中所说的仅在 chrome 中发生,因为在 firefox 中“(导航器中的'serviceWorker')”总是错误的,并且“console.warn('此浏览器不支持服务工作者。');” 而是触发。

如果您清除浏览器或运行隐身模式,那么它最初可以工作,但是当您第一次注销然后重新登录时,问题就开始了。

这是网络日志中的样子

这是我在其中注册 SW 的代码:

'/service-worker' 是一个发送到 index.php 的请求(通过 .htaccess)。它最终以这个函数结束:

在 chrome://serviceworker-internals/ 中看到的 Service-worker.js 看起来像这样:(对地址的几个引用已被星号替换)

现在,如果您注释掉“if(!navigator.serviceWorker.controller) navigator.serviceWorker.register('/service-worker', { scope: '/' });” 然后问题消失了,但是订阅和取消订阅的服务人员停止工作。(if 语句似乎没有多大作用,只是为了解决这个问题而添加的)

我已经尝试了许多具有不同条件的 activateSW() 版本来运行不同的表达式,并且没有设法制作一个在不破坏 serviceworker 的情况下工作的版本。我还尝试在各个点(注册、帖子)上捕获错误,但这没有成功,因为它们都没有抛出任何错误。

我怀疑可能是问题在于,当您注册服务人员时,会触发激活事件。现在,如果您抓住了这一点并完成了事件承诺,那么您将无法订阅。但是,我怀疑服务人员在您注销时仍然处于活动状态,这会导致问题。

如果您有疑问或想查看更多代码,请询问。

编辑; 这是解决方案:

0 投票
1 回答
427 浏览

karma-runner - 在 Karma 测试中加载和使用 Service Worker

我们想编写一个对加载的文件执行源代码转换的Service Worker 。为了测试这个功能,我们使用 Karma。

我们的测试导入源文件,在这些文件上执行源代码转换。只有在 Service Worker 执行转换时测试才会成功,而在 Service Worker 不活动时测试会失败。

在本地,我们可以启动 KarmasingleRun: false并观察更改的文件以重新启动测试。但是,Service Worker 对于最初加载它们的页面是不活动的。因此,除了第一个测试用例之外,每个测试用例都会成功。

但是,对于持续集成,我们需要单运行模式。因此,我们的 Service Worker 在测试运行期间是不活动的,因此会失败。此外,连续两次运行并不能解决此问题,因为 Karma 会重新启动使用过的浏览器(因此我们失去了 Service Worker)。

那么,问题来了,如何让 Service Worker 在测试运行中可用?例如,通过保留 karma 使用的浏览器实例。

0 投票
4 回答
16443 浏览

javascript - 如何从不同的子域注册服务工作者

我有两个子域:https://abc.xxxx.comhttps://xyz.xxxx.com。所以我的问题:

1)。是否可以 从https://abc.xxxx.com为https://xyz.xxxx.com注册服务人员 ?如果是,那怎么办?

2)。如果http://abc.xxxx.com ( http不安全) 那么无论如何都要从http://abc.xxxx.com为https://xyz.xxxx.com注册一个服务工作者,比如在 iframe 或其他东西中......

这是一个真实的情况,我面临着我的多个子域。任何帮助表示赞赏。提前致谢。

0 投票
2 回答
1245 浏览

ecmascript-6 - 在服务工作者中使用 browser.js

我们希望使用Service Worker来执行客户端源代码转换以用于开发目的。我们想使用Babel将 ES6+/ES2015 文件转换为 ES5 模块。

但是,在 Service Worker using 中包含浏览器版本importScripts的 babel会导致以下错误:

那么,问题来了,如何正确地将 babel 导入到 Service Worker 中。

编辑:这不是明显的 NetworkError,因为我们可以将文件的内容更改为简单的内容,这使我们能够实际加载和执行文件。此外,可以使用普通<script>标签加载文件。

edit2:要获取此消息,请查看此存储库https://github.com/onsetsu/lively4-core.git,在端口 8080 启动本地服务器,最后加载http://localhost:8080/bootworker.html。我们目前使用的是 Chrome 44。

0 投票
1 回答
1702 浏览

javascript - 没有为网站图标触发 ServiceWorker 'fetch' 事件

我正在使用服务人员在我的网站 ( https://adhiyan.in ) 中缓存内容。Serviceworker 正在正确安装和激活。在“获取”事件处理程序中,如果可用,我将从缓存中提供内容。如果缓存中没有内容,我将获取内容并使用相同的内容更新缓存。它能够按需提供资产并缓存新资产。

但是,我看到浏览器正在下载网站图标而没有触发“获取”事件。我可以从 Chrome devtools 的网络面板确认行为。有人可以帮我理解这种行为吗?我错过了代码中的某些内容吗?

网络面板 Chrome devtools

0 投票
1 回答
1395 浏览

android - Web 应用安装横幅未显示

我有一个网站 ( https://adhiyan.in ),我相信它符合网络应用安装横幅的所有标准,但横幅没有显示。有人可以帮我找出原因吗?(我尝试过使用和不使用标志 chrome://flags/#bypass-app-banner-engagement-checks)</p>

我正在使用 Chrome for Android stable v44.*

0 投票
2 回答
420 浏览

web-worker - Web Worker 中的 Service Worker

实现可以使用服务工作者处理网络调用的网络工作者的正确方法是什么。例如

  • 我有一个 index.html 文件,它有自己的渲染数据逻辑
  • 然后这个web worker负责发送需要渲染的数据并触发渲染过程
  • webworker 将使用 service worker 来获取和缓存网络请求/json 数据。
0 投票
1 回答
2479 浏览

javascript - 没有 SSL 的 Chrome 网络通知(绕过 Service Worker)

那么,是否可以在没有 SSL 证书的情况下为 Chrome 实现网络通知?我想避免在我的网站上安装 SSL,如果有一种方法可以在没有 Service Worker 的情况下发送通知,那就太好了。