html5的service worker,GitHub - w3c/ServiceWorker: Service Workers

最新推荐文章于 2023-04-07 13:46:58 发布
最新推荐文章于 2023-04-07 13:46:58 发布
阅读量132 收藏
点赞数
文章标签： html5的service worker

What’s going on here?

Service workers are a new browser feature that provide event-driven scripts that run independently of web pages. Unlike other workers, service workers can be shut down at the end of events, note the lack of retained references from documents, and they have access to domain-wide events such as network fetches.

Service workers also have scriptable caches. Along with the ability to respond to network requests from certain web pages via script, this provides a way for applications to “go offline”.

Service workers are meant to replace the (oft maligned) HTML5 Application Cache. Unlike AppCache, service workers are comprised of scriptable primitives with an extensive use of Promises that make it possible for application developers to build URL-friendly, always-available applications in a sane and layered way.

To understand the design and how you might build apps with service workers, see the explainer document.

Spec and API development

For the nitty-gritty of the API, the draft W3C specifications are authoritative. Service Workers Nightly is a living document. Service Workers 1 is a subset of the nightly version that is advancing toward a W3C Recommendation. For implementers and developers who seek all the latest features, Service Workers Nightly is a right document that is constantly reflecting new requirements. For version 1, contributors plan to focus on fixing bugs and resolving compatibility issues without including new features from the nightly version.

Spec development happens via issues in this repository. For general discussion, please use the public-webapps@w3.org mailing list with a Subject: prefix of [service-workers].

Updates to the spec must reference resolved issues marked needs spec.

To make edits to the design, please send pull requests against the Nightly spec on the master branch. We use bikeshed. So, change docs/index.bs and submit it with the corresponding bikesheded index.html.

Examples

The W3C Web Mobile Group have defined a series of use-cases where service worker is particularly useful. You can help by adding more use cases, draft implementation code, or even working examples once browsers support the required APIs.

About labels and milestones on issues

This is to explain how we use labels and milestones to triage the issues. Note: This is a draft, suggestions for improvements are welcomed.

Prioritization

enhancement: is for anything that was assessed as not having any impact on the decisions for the current milestone and can therefore be safely discussed, rejected or prioritized later.

milestone: is used to mark issues we agreed to get done in principle by a given revision. For the sake of efficiency, we tend to only focus on the current milestone and leave everything else without specific milestones.

impacts MVP: is used to mark issues impacting the “Minimal Viable Product”. The MVP is the minimal scope of API that can solve actual use cases. These issues have the highest priority.

Risk labels for impacts MVP issues

medium risk: to further refine the “impacts MVP” issues. It indicates that the issue is moderately complex and that reaching a conclusion might take some time. These are of higher priority than issues with no risk label but are of lower priority than issues with a “high risk” label.

high risk: to further refine the “impacts MVP” issues. It indicates that the issue is significantly complex and that reaching a conclusion might take a lot of time and effort. These are of higher priority than issues with no risk label or a “medium risk” label.

Actions

needs spec: a decision has been made and the spec needs to be updated.

spec detail: has no significant implications for implementers nor web developers.

decided: to record that a decision has been made.

invalid: when something doesn’t constitute a valid issue.

wontfix: a decision has been made not to pursue this issue further.

duplicate: when a similar issue has already been filed.

bug: an oversight that needs to be fixed.

Areas

fetch: relates to Fetch

lifecycle: relates to lifecycle aspects of service worker

cache: relevant to the Cache APIs

question: not an actual issue. Items that have been filed in order to gain a better understanding of service worker.

老子不想学习
关注
HTML5-Service Worker实现离线页面访问
柒青衿的博客
06-10 6519
如果提到HTML5的新API，WebSocket ，Web Workers大家应该比较熟悉。WebSocket是用于简述请求数量的新协议，Web Workers是用于实现浏览器的多线程。而今天要介绍的Service Worker是用于页面离线缓存，提供类似App的服务。注意，这和浏览器缓存不是一回事。 下面所有代码请查看github下载完整版本 1. Service Worker 介绍试想，当你
HTML5-service worker进行缓存控制
柒青衿的博客
12-02 6289
讲一下使用service worker做缓存版本控制。1. 基础生命周期installing -> activated -> fech/message需要关注的生命周期阶段以下代码以使用indexedDB为例，后面提供使用service worker自带的cache的版本 install：首次缓存self.addEventListener('install', function(e){ c
html5的service worker,腾讯浏览服务-Service Worker
weixin_33800919的博客
06-19 226
二. 一个简单的示例该示例展示了Service Worker最基本的离线缓存应用，前端在原来的web应用中使用Service Worker只需要三大步：1、切入到https；由于Service Worker可以劫持连接，伪造和过滤响应，所以保证其在传输过程中不被篡改非常重要。2、在页面加载的恰当时机注册Service Worker；示例中在index页面的body onload事件中注册了同pat...
html5离线缓冲（service worker）
Win32FanEx 的专栏
06-24 308
最简单示例程序
Service Worker
肖的博客
08-27 389
基本特性 不能直接访问/操作 DOM（只能使用特定的 API：Promise、Fetch API、Cache API） 需要时直接唤醒，不需要时自动休眠 离线缓存内容开发者可控 一旦被安装则永远存活，除非手动卸载 必须在 HTTPS 环境下工作（本地环境 localhost 除外） 广泛使用了 Promise 使用 生命周期相关知识 install 阶段缓存文件列表 activate 阶...
Service Worker 生命周期
cleanHtroop的博客
06-20 735
Service Worker是什么 在讲service worker之前，首先会提到PWA（Progressive Web App），中文叫作渐进式网页应用。 在以往的客户端中，主流的有Native App和Web App，两者都有各自的优点。 PWA通过应用一些新的技术，使得Web App具有一些Native APP的优点。例如：添加图标，推送消息，快速启动等，而且同时拥有Web App的无版本特点。 那么PWA主要包括三个特点： 在所有的网络环境下，都能瞬间加载并展示 像Native App
谷歌浏览器未发送任何数据_将 service worker 引入谷歌搜索
weixin_39646658的博客
12-08 3631
作者 | Brilliant Open Web团队编辑 |Brilliant Open Web团队近日谷歌发表了一篇关于谷歌搜索引入 service worker 的文章，文章详细介绍了引入过程中一些有意思的问题和解决方案，能帮助读者了解和使用 service worker，因此对原文进行了翻译，方便大家一起来学习和借鉴。原文链接：https://web.dev/google-sear...
Spark环境搭建教程
xgb2018的博客
03-27 4286
Spark环境搭建 Spark Local本地模式 Standalone-独立集群 Standalone-HA Spark-On-Yarn Spark 是一种基于内存的快速、通用、可扩展的大数据分析计算引擎
HTML5中的Service Worker是什么？它有什么用途？底层原理是什么？
长风破浪会有时的博客
04-07 398
底层原理是，Service Worker是一个独立的线程，它运行在Web应用程序的上下文之外，并与Web页面通过postMessage通信。如果该请求未被缓存，则可以向服务器发出请求，并将响应存储在缓存中，以供后续使用。HTML5中的Service Worker是一种JavaScript Worker，它运行在后台，并能够拦截和处理来自Web应用程序的网络请求。它允许您控制Web应用程序的离线行为，并提供了一种强大的缓存机制，以使应用程序能够在离线状态下继续工作。拦截网络请求并提供自定义的响应。
Service Worker的基本使用
陈海峰的博客
03-02 5246
环境准备 安装http-server npm install -g http-server 准备index.html   Minimal PWA           Revision 8         Minimal PWA, open Console for more!         Network:     G
Service Worker初体验(Progressive Web Apps)
game3108的专栏
11-02 1117
Progressive Web Apps 其实是一系列的 Web 功能和技术的集合，其目的在于增强 Web Apps 的功能和体验，使之更像 Native Apps。这边转载一篇Progressive Web Apps的技术核心的文章，关于Progressive Web Apps可以了解2016Qcon的ppt：https://huangxuan.me/pwa-qcon2016/#/
初探ServiceWorker
03-04 8646
最近接触了ServiceWorker的一些东西，整理了一些基本的东西。因为本人不是做JS开发所以对JS理解没有那么深，所以这篇文章是看了一些国外的博客，MDN后加了一些自己的理解，有些地方翻译的不是太准。      参考资料:          MDN:https://dbwriteups.wordpress.com/2015/11/16/service-workers-part-4-back
初识 ServiceWorker
ForeverCjl的专栏
09-29 3311
初识ServiceWorker 初识ServiceWorker 在8月份的时候，W3C更新了一个叫Service Workers的API。 了解过HTML5中的Web Worker的人可能会对这个API会更容易理解一些，不然的话会将这两个API搞混。 其实，Service Worker是基于Web Worker的事件驱动的，他们执行的机制都是新开一个线程去处理一
聊聊Service Worker
祝小余不定时更新
09-07 2860
Web Workersweb worker: 为Web内容在后台线程中运行脚本提供了一种简单的方法，线程可以执行任务而不干扰用户界面,即：运行在后台的 JavaScript浏览器一般有三类 web Worker： - Worker：专用的 worker，只能被创建它的 JS 访问，生命周期到创建它的页面关闭时结束。 - SharedWorker：共享的 worker，可以被好几个 JS 访问，生
Service Worker 学习笔记
weixin_34343689的博客
03-21 308
Service Worker 学习笔记 Service Worker挺有意思的，前段时间看了相关的资料，自己动手调了调demo，记录一下学习过程。文中不仅会介绍Service Worker的使用，对fetch、push、cache等Service Worker配套的API都会涉及，毕竟Service Worker与这些API配合使用才能发...
serviceworker运用与实践
热门推荐
brizer的博客
01-24 1万+
前言 本文首先会简单介绍下前端的常见缓存方式，再引入serviceworker的概念，针对其原理和如何运用进行介绍。然后基于google推出的第三方库workbox，在产品中进行运用实践，并对其原理进行简要剖析。 前端缓存简介 先简单介绍一下现有的前端缓存技术方案，主要分为http缓存和浏览器缓存。 http缓存 http缓存都是第二次请求时开始的，这也是个老生常谈的话题了。无非也是那几个http...
Service Worker -- 特殊的Web Worker
liuyahui_0126的博客
10-18 3688
在介绍service之前，先引入一下PWA（由Google的Chrome团队创造），技术支持主要是ServiceWorker和Web App Mainfest PWA是一种webapp模型，是一种渐进的web app，利用一些web特性，配合ui使用，增强web app的用户体验。（手机使用Safari 进入 mi.com 将它保存在手机桌面上，点击桌面上相应快捷方式时，不会再显示url）。 ...
我想将frontend 也是用volumes，将其映射到/app/frontend目录，在/app/frontend下install以及build，如何实现 docker-compose.yml文件： version: '3' services: frontend: build: context: ./frontend dockerfile: Dockerfile ports: - 8010:80 restart: always backend: build: context: ./backend dockerfile: Dockerfile volumes: - /app/backend:/app environment: - CELERY_BROKER_URL=redis://redis:6379/0 command: python manage.py runserver 0.0.0.0:8000 ports: - 8011:8000 restart: always celery-worker: build: context: ./backend dockerfile: Dockerfile volumes: - /app/backend:/app environment: - CELERY_BROKER_URL=redis://redis:6379/0 command: celery -A server worker -l info --pool=solo --concurrency=1 depends_on: - redis - backend restart: always celery-beat: build: context: ./backend dockerfile: Dockerfile volumes: - /app/backend:/app environment: - CELERY_BROKER_URL=redis://redis:6379/0 command: celery -A server beat -l info --scheduler django_celery_beat.schedulers:DatabaseScheduler depends_on: - redis - backend restart: always redis: image: redis:latest ports: - 6379:6379 restart: always mysql: image: mysql:latest environment: - MYSQL_ROOT_PASSWORD=sacfxSql258147@ ports: - 8016:3306 volumes: - ./mysql:/var/lib/mysql restart: always frontend：dockerfile文件 FROM node:16.18.1 WORKDIR /app/frontend COPY package*.json ./ RUN npm install COPY . . RUN npm run build:prod FROM nginx:latest COPY --from=0 /app/frontend/dist/ /usr/share/nginx/html EXPOSE 80 CMD ["nginx", "-g", "daemon off;"]
最新发布
07-14
command: celery -A server worker -l info --pool=solo --concurrency=1 depends_on: - redis - backend restart: always celery-beat: build: context: ./backend dockerfile: Dockerfile volumes: - ...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值