service worker 实现页面通信
sw.js
基本写法:
function send_message_to_sw(msg){
navigator.serviceWorker.controller.postMessage("Client 1 says '"+msg+"'");
}
广播写法:信息可以同步作用域下所有页面。
self.addEventListener('message', function(event){
console.log(event.data);
console.log(event.ports);
event.ports[0].postMessage(event.data + 1);
});
service worker 实现页面通信的更多相关文章
- 渐进式web应用开发---Service Worker 与页面通信(七)
_ 阅读目录 一:页面窗口向 service worker 通信 二:service worker 向所有打开的窗口页面通信 三:service worker 向特定的窗口通信 四:学习 Messag ...
- 浅析Service Worker
一.service worker是什么? 平常浏览器窗口中跑的页面运行的是主JavaScript线程,DOM和window全局变量都是可以访问的. Service Worker是走的另外的线程,可以理 ...
- JavaScript是如何工作的:Service Worker的生命周期及使用场景
摘要: 理解Service Worker. 原文:JavaScript 是如何工作的:Service Worker 的生命周期及使用场景 作者:前端小智 Fundebug经授权转载,版权归原作者所有. ...
- 渐进式web应用开发---service worker (二)
阅读目录 1. 创建第一个service worker 及环境搭建 2. 使用service worker 对请求拦截 3. 从web获取内容 4. 捕获离线请求 5. 创建html响应 6. 理解 ...
- service worker介绍
原文:Service workers explained 译者:neal1991 welcome to star my articles-translator, providing you advan ...
- 使用 Service Worker 缓解网站 DDOS 攻击
前言 传统的 DDOS 防御开销很大,而且有时效果并不好. 例如使用 DNS 切换故障 IP 的方案,由于域名会受到缓存等因素的影响通常有分钟级延时,前端难以快速生效.例如使用 CDN 服务,虽可抵挡 ...
- Service Worker基础知识整理
Service Worker是什么 service worker 是独立于当前页面的一段运行在浏览器后台进程里的脚本.它的特性将包括推送消息,背景后台同步, geofencing(地理围栏定位),拦截 ...
- 转《service worker在移动端H5项目的应用》
1. PWA和Service Worker的关系 PWA (Progressive Web Apps) 不是一项技术,也不是一个框架,我们可以把她理解为一种模式,一种通过应用一些技术将 Web App ...
- 渐进式web应用开发---service worker 原理及介绍(一)
渐进式web应用(progressive Web app) 是现代web应用的一种新形式.它利用了最新的web功能,结合了原生移动应用的独特特性与web的优点,为用户带来了新的体验. 一:传统web端 ...
随机推荐
- SSD是什么
SSD即固态硬盘,相较于HDD(机械硬盘),硬件上最主要的区别就是存储介质发生了改变,SSD采用NAND Flash作为存储介质,而HDD采用磁盘作为存储介质.虽然这两种存储介质都是非易失性的,但是他 ...
- Java 基础篇之注解
注解 注解,其实是代码里的特殊标记,这些标记可以在编译.类加载.运行时被读取,并执行相应的处理.通过使用注解,可以在不改变原有逻辑的情况下,在源文件中嵌入补充一些信息. Annotation 提供了一 ...
- Pulse Secure 任意文件读取(CVE-2019-11510)漏洞
漏洞分析 我们可以通过CVE-2019-11510这个未授权的任意文件读取漏洞把以下文件下载回来. /etc/passwd /etc/hosts /data/runtime/mtmp/system / ...
- sql绕过转义符注入
宽字节绕过总结 1. 重点:转义符反斜杠\,ASCII码0x5C 2. 在双字节字符集中, 在\前面增加高字节,0x5C被当做低字节,组合为“汉字”,导致\符号被“吃掉”,后续字符逃出限制,从而绕 ...
- ambari 快速安装部署
OS:Linux CPU消耗大,要准备5G以上,不然集群启动不了(我自己给它配了8G,启动整个集群是没问题,要用的话估计不够) 一.准备工作: 1.关闭防火墙:sudo ufw disable/ 2. ...
- 在windows系统电脑上同时安装python2.x和python3.x版本
在同一个电脑机子(windows系统)上安装同时安装python2.x和python3.x版本. 一.python2.x和python3.x安装 步骤1:在python官网(https://www.p ...
- 【Python】【demo实验10】【练习实例】【打印斐波那契数列】
斐波那契数列介绍: 斐波那契数列(Fibonacci sequence),又称黄金分割数列.因数学家列昂纳多·斐波那契(Leonardoda Fibonacci)以兔子繁殖为例子而引入,故又称为“兔子 ...
- joda-time使用
pom.xml <?xml version="1.0" encoding="UTF-8"?> <project xmlns="htt ...
- STL queue 常见用法详解
<算法笔记>学习笔记 queue 常见用法详解 queue翻译为队列,在STL中主要则是实现了一个先进先出的容器. 1. queue 的定义 //要使用queue,应先添加头文件#incl ...
- 老贾的幸福生活day03 之思维导图
思维导图 层级关系 从大范围到具体 编程语言 编译型 C C++ ...... 解释型 python php ......... python 基础语法 基础数据类 ...