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 实现页面通信的更多相关文章

  1. 渐进式web应用开发---Service Worker 与页面通信(七)

    _ 阅读目录 一:页面窗口向 service worker 通信 二:service worker 向所有打开的窗口页面通信 三:service worker 向特定的窗口通信 四:学习 Messag ...

  2. 浅析Service Worker

    一.service worker是什么? 平常浏览器窗口中跑的页面运行的是主JavaScript线程,DOM和window全局变量都是可以访问的. Service Worker是走的另外的线程,可以理 ...

  3. JavaScript是如何工作的:Service Worker的生命周期及使用场景

    摘要: 理解Service Worker. 原文:JavaScript 是如何工作的:Service Worker 的生命周期及使用场景 作者:前端小智 Fundebug经授权转载,版权归原作者所有. ...

  4. 渐进式web应用开发---service worker (二)

    阅读目录 1. 创建第一个service worker 及环境搭建 2. 使用service worker 对请求拦截 3. 从web获取内容 4. 捕获离线请求 5. 创建html响应 6. 理解 ...

  5. service worker介绍

    原文:Service workers explained 译者:neal1991 welcome to star my articles-translator, providing you advan ...

  6. 使用 Service Worker 缓解网站 DDOS 攻击

    前言 传统的 DDOS 防御开销很大,而且有时效果并不好. 例如使用 DNS 切换故障 IP 的方案,由于域名会受到缓存等因素的影响通常有分钟级延时,前端难以快速生效.例如使用 CDN 服务,虽可抵挡 ...

  7. Service Worker基础知识整理

    Service Worker是什么 service worker 是独立于当前页面的一段运行在浏览器后台进程里的脚本.它的特性将包括推送消息,背景后台同步, geofencing(地理围栏定位),拦截 ...

  8. 转《service worker在移动端H5项目的应用》

    1. PWA和Service Worker的关系 PWA (Progressive Web Apps) 不是一项技术,也不是一个框架,我们可以把她理解为一种模式,一种通过应用一些技术将 Web App ...

  9. 渐进式web应用开发---service worker 原理及介绍(一)

    渐进式web应用(progressive Web app) 是现代web应用的一种新形式.它利用了最新的web功能,结合了原生移动应用的独特特性与web的优点,为用户带来了新的体验. 一:传统web端 ...

随机推荐

  1. iOS UITextField限制输入字数

    关于iOS的文本框有时需要限制字数,如手机号,在UITextField的代理单纯写一个判断,在字数超过限制时,这时再想删除就删除不掉,可以在代理这样写,就解决 - (BOOL)textField:(U ...

  2. 【Adobe Air程序开发】eclipse安装flash builder 4.7插件以及java、flex整合开发

    看了看网上不少文章,发现很多内容都是很老的,没法用.故把自己的安装过程记录下来,方便以后使用 1.在这里,eclipse使用最新版eclipse juno 3.7 2.在adobe官网https:// ...

  3. CSS实现网页背景图片自适应全屏,自适应背景图片

    一张清晰漂亮的背景图片能给网页加分不少,设计师也经常会给页面的背景使用大图,我们既不想图片因为不同分辨率图片变形,也不希望当在大屏的情况下,背景有一块露白,简而言之,就是实现能自适应屏幕大小又不会变形 ...

  4. csp模拟赛低级错误及反思

    \(csp\)模拟赛低级错误及反思. 1.没开\(longlong\). 反思:注意数据类型以及数据范围. 2.数组越界(前向星数组未开两倍,一题的数据范围应用到另一题上,要开两倍的写法为开两倍数组) ...

  5. Linux就该这么学——新手必须掌握的命令之文件编辑命令组

    cat 命令 用途 : 用于查看纯文本文件 格式 : cat [选项] [文件] 示例 : more 命令 用途 : 用于查看纯文本文件(内容较多的),可以用”Enter” 键或者”Space”键向下 ...

  6. 老贾的幸福生活day03 之思维导图

    思维导图 层级关系 从大范围到具体 编程语言 ​ 编译型 ​ C ​ C++ ​ ...... ​ 解释型 ​ python php ​ ......... python ​ 基础语法 ​ 基础数据类 ...

  7. luffy后台相关设置

    目录 项目创建 环境 创建项目 重构项目目录 配置开发环境 配置日志 环境变量 dev.py 在写项目直接导入utils文件夹也不''错误提示'' 封装logger dev.py utils/logg ...

  8. 【二分】Shell Pyramid

    [来源]:2008年哈尔滨区域赛 [题目链接]: http://acm.hdu.edu.cn/showproblem.php?pid=2446 [题意] 题目是真的长呀,其实就问一个问题. 按照图里面 ...

  9. 两个链表的第一个公共结点——牛客offer

    题目描述: 输入两个链表,找出它们的第一个公共结点. 题目分析: 只是数据域相同不是公共节点.公共结点代表该节点在两个链表中的数据域和指针域都是相同的,这意味着从该公共节点开始,后面的结点都是两个链表 ...

  10. 牛客 40E 珂朵莉的数论题

    大意: 给定$x,y$, 求第$x$小的最小素因子为$y$的数, 若答案>1e9输出0. 若$y>=60$, 可以暴力筛出1e9/60以内的答案. 否则容斥+二分算出答案. #includ ...