首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

Chrome 85 Service worker坚持尝试安装

Chrome 85 Service Worker是Chrome浏览器的一个功能,它是一种在浏览器后台运行的脚本,可以拦截和处理网络请求,实现离线缓存、消息推送等功能。

Service Worker的主要特点包括:

  1. 后台运行:Service Worker在浏览器后台运行,独立于网页,可以在网页关闭后继续执行。
  2. 离线缓存:Service Worker可以缓存网页的资源文件,使得用户在离线状态下也能访问已缓存的网页。
  3. 拦截请求:Service Worker可以拦截浏览器发出的网络请求,可以用来实现自定义的缓存策略、请求转发等功能。
  4. 消息推送:Service Worker可以接收服务器推送的消息,并在用户离线时显示通知。

Service Worker的应用场景包括:

  1. 离线访问:通过缓存网页资源,使得用户在离线状态下也能访问已缓存的网页。
  2. 快速加载:通过缓存常用资源,加快网页加载速度。
  3. 消息推送:通过Service Worker接收服务器推送的消息,并在用户离线时显示通知。

腾讯云提供了一些相关的产品和服务,可以帮助开发者使用Service Worker:

  1. 腾讯云CDN:提供全球加速、缓存加速等功能,可以加速网页资源的分发和加载。
  2. 腾讯云Serverless:提供无服务器计算服务,可以用来部署和运行Service Worker脚本。
  3. 腾讯云消息队列CMQ:提供消息队列服务,可以用来实现消息推送功能。

更多关于Service Worker的信息,可以参考腾讯云的文档:

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

异步JS中的Web Workers

Service Workers: 服务线程, 一个注册在指定源和路径下的事件驱动worker, 采用 js 控制关联的页面或者网站,拦截并修改访问和资源请求,细粒度地缓存资源....如果你使用的是chrome, 在地址栏输入chrome://inspect/#workers即可打开后台工具, 可以看到当前的一些workers, worker的名称是调用 new SharedWorker...Canary: 访问 chrome://flags 并开启 experimental-web-platform-features; 重启浏览器 (注意:有些特性在 Chrome 中没有默认开放支持)...全局上下文. 2) 安装 注册和下载之后浏览器会进入安装阶段, 可以通过 install 事件进行监听, 并且在这个事件里可以对站点资源进行缓存 self.addEventListener('install...caches.delete 方法删掉对应 key 值的Cache 条目. 3) 更新 当重新进入 SW 页面, 或者在 SW 上的一个事件被触发并且过去 24 小时没有被下载时会触发更新, 如果下载的 SW 文件是新的, 安装就会在后台尝试进行

1.6K20

PWA 入门: 写个非常简单的 PWA 页面

随后添加上 App Manifest 和 Service Worker 来实现 PWA 的安装和离线等功能。...然后在 HTML 文件当中引入配置: 添加 Service Worker Service Worker 在网页已经关闭的情况下还可以运行, 用来实现页面的缓存和离线, 后台通知等等功能。...借助 Service Worker, 可以在注册完成安装 Service Worker 时, 抓取资源写入缓存: 调用 self.skipWaiting() 方法是为了在页面更新的过程当中, 新的 Service...由于 Service Worker 限制了使用 HTTPS 地址或者 localhost 地址, 在 Android Chrome 打开需要借助 ngrok 生成的 HTTPS 地址, 这样才能把 demo...在这个 Demo 当中, 被缓存的资源是无法发起请求判断是否被更新的, 只有 sw.js 会自动根据 HTTP 缓存的机制尝试去判断应用是否被更新。

2.7K50

PWA 那些事儿

随后添加上 App Manifest 和 Service Worker 来实现 PWA 的安装和离线等功能 解决了哪些问题?...如果用的是安卓手机,可以下载 chrome 浏览器自己操作看看 3.2 service worker 实现离线缓存3.2.1 什么是 service worker Service WorkerChrome...但可以通过事件机制来处理 事件驱动型服务线程 为什么要求网站必须是 HTTPS 的,大概是因为 service worker 权限太大能拦截所有页面的请求吧,如果 http 的网站安装 service...第 3 步: 一旦 Service Worker 成功执行了,install 事件就会激活 第 4 步: 安装完成,Service Worker 便会激活,并控制在其范围内的一切。...chrome://serviceworker-internals 来了解当前浏览器中所有已安装 Service Worker 的详细情况 3.2.2 HTTP 缓存与 service worker 缓存

1.7K00

为 vue 项目添加 PWA 支持

vue & PWA 如果您的目的不是为现有的 vue 项目添加 PWA 支持,那么更推荐尝试 Lavas 注:PWA 应用要求必须全程 https,且在已安装的 PWA 应用中无法发送 http 请求...如果你有较高的定制需求,需要在已有 Service Worker 的基础上将项目 PWA 化,则选择InjectManifest,插件会在你指定的service-worker.js的基础上加入 precache...PWA 应用,以下列举目前我所知道的添加方式 Chrome 专有方式 对于 PC 或 Android 的 Chrome 浏览器都可以实现点击一个按钮来添加 PWA 应用,其原理是拦截了beforeinstallprompt...可通过右上角菜单添加(此处以 m.weibo.cn 为例) PC Android Service Worker 的更新 这是开发 PWA 应用时需要考虑的一个重要问题 由于 Service Worker...的更新机制(扩展阅读:【Service Worker】生命周期那些事儿),直接单纯的刷新页面并没有结束当前 session,因此依然是旧的 SW 在接管页面,新的 SW 仍旧是 waiting 状态

3.5K00

如何使用浏览器工具调试PWA

在桌面Chrome上,它会触发浏览器将应用添加到货架(shelf)。 在移动设备上,它提示安装应用程序(将图标添加到主屏幕): ?...Service Workers首次加载时会将其安装在设备上。 在Service Workers代码更改之前,它们不会更新,因此它们不像常规资源。...显示所有是一个选项,可以快速访问所有安装在设备上Service Worker。 每个Service Worker都有一个状态指示器,您可以停止并重新启动。...像Chrome一样,当用Cache API使用被“开发工具”的“网络”面板中的Service Worker缓存的资源时,在Transferred列下列出了『Service Worker』: ?...浏览器,尤其是Chrome,可以为他们提供很好的工具。 Google还提供Lighthouse作为其浏览器工具的一部分,可以在Chrome DevTools中单独安装

3.6K40

开发一个渐进式Web应用程序(PWA)前都需要了解什么?

如果浏览器检测到网站存在PWA清单文件,Chrome会自动出现“添加到主屏幕”按钮。如果用户点击同意,该图标将被添加到主屏幕,并且将安装PWA。 ?...Service Worker生命周期 对于Service Worker,基本设置的步骤如下: 首先应注册SW,如果SW已注册,浏览器会根据于安装事件自动开始安装安装SW后,它将收到激活事件。...你可以打开Chrome DevTools – Application - Service Worker 中检查SW是否已经启用。...在Service Worker安装期间进行预缓存 当用户第一次访问你的网站时,SW会开始自行安装。...在Service Worker安装并激活后,刷新页面并再次检查网络选项卡。现在,Service Worker将拦截HTTP请求,并从缓存中即时加载相应的资源,而不是向服务器发出网络请求。

1.6K20

【译】使用默认方式更新service worker

此外,从Chrome 78开始,service worker中对于通过importScripts()加载的脚本将逐字节进行比较。...对于 Chrome 68 之前的版本,/service-worker.js的更新请求会受HTTP缓存的影响(包含大多数的fetch请求)。...从Chrome 68开始,更新service worker脚本时,HTTP缓存将被忽略,因此,68版本后的浏览器中可以看到Web应用对其service worker脚本的请求频率增加,但importScripts...仅仅有一种方式可以强制更新已经安装service worker引入的脚本就是更新其URL,通常是通过添加一个semver值(例如 importScripts('https://example.com/...从Chrome 78开始,每次对service worker脚本执行更新检查时,都将同时检查导入脚本的内容是否已更改。

2K10

2020前端性能优化清单(五)

Chrome、Firefox、Safari 和 Edge 中可以对该 API 提供部分支持[53],在所有现代浏览器中都支持 service worker[54]。 45....目前只有 Chrome、Android 版 Chrome安装了 Data Saver 扩展的桌面设备上支持。...如果您的网站运行的是 HTTPS,请使用“实用主义者的 service worker 指南[85]”,将静态资源缓存到 service worker 中,并存储脱机降级资源(甚至脱机页面),然后从用户的机器中检索它们...使用 service worker 的一个很好的起点是 Workbox,它是一组专门为构建渐进式 web 应用程序而构建的 service worker 库。 49....Service worker安装率曲线。根据 Web 年鉴,只有 0.44%的桌面页面注册了 service worker,。 50.

1.9K20

咱们worker有力量-在浏览器中实现多线程和离线应用

Service Worker ? Service Worker 基于 Web Worker 的事件驱动,提供了用来管理安装、版本、升级的一整套系统。...类似,需要小心 service worker 脚本里的全局变量: 每个页面不会有自己独有的worker 安装service worker 注册之后,install 事件会被触发 在 install...用户打开页面时,浏览器会尝试在后台重新下载该 JS 文件;如果该文件与其当前所用文件存在字节差异,则将其视为“新版本的 service worker”。...新服务工作线程将会启动,且将会触发 install 事件 如果 service worker 已经被安装,但是刷新页面时有一个新版本的可用 -- 那么新版本虽会在后台安装,但还不会激活,且进入 waiting...,如待办事项更新或日历更改 需要 google 的 FCM 通道服务,目前国内无法使用 chrome 离线小恐龙的游戏 正是基于 service workerchrome 在网络不可用时会显示小恐龙冒险的离线游戏

2.4K80
领券