通信API、使用Web Workers处理线程
1、跨文档消息传输
要想接受从其他的窗口那里发过来的消息,就必须对窗口对象的message事件进行监视。
window.addEventListener("message",function(ev){...},false);
ev.orgin:获取消息的发送源;
ev.data:消息内容;
ev.source:获取消息发送源的窗口对象。
使用window对象的postMessage方法向其他窗口发送消息。
otherWindow.postMessage(message,targerOrigin);
2、Web Sockets通信
HTML5提供的在Web应用程序中客户端与服务器端之间进行的非HTTP的通信机制。
构建连接:var webSocket=new WebSocker("ws://localhost:8081/socket");//URL必须以ws或者wssk开头。
发送消息:webSocket.send("data");
接收服务器消息:
webSocket.onmessage=function(event){
var data=event.data;
}
监听socket打开和关闭事件:
websocket.onopen=function(event){...}
websocket.onclose=function(event){...}
关闭socket:webSocket.close();
readyState属性只可以获取WebSocket对象的状态。
3、使用Web Workers处理线程
创建后台线程:var worker=new Worker("worker.js");//参数为后台线程执行的URL
后台线程不能访问页面或窗口对象。
在后台线程之中接收消息:worker.onmessage=function(event){/*处理收到的消息*/}
对后台线程发送消息:worker.postMessage(message);
在后台线程中,也可以获取worker对象的onmessage事件句柄和postMessage方法在后台进行消息的发送和接收。
与线程进行数据交互:获取数据后动态创建页面元素。
线程嵌套:
单层嵌套:在后台线程中再创建线程。
向主页面线程发送消息用的是postMessage,而向子线程用worker.postMessage。
在多个子线程中进行数据的交互:
线程中可用的变量、函数与类:
self,postMessage(message),onmessage,importScript(urls),nacigator对象,sessionStore/localStore,XMLHttpRequest,Web Workers,setTimeout(),setInterval(),close,eval(),isNan(),escape()等javaScript核心函数,object,WebSorckets.
通信API、使用Web Workers处理线程的更多相关文章
- (92)Wangdao.com_第二十五天_线程机制_H5 Web Workers 分线程任务_事件 Event
浏览器内核 支撑浏览器运行的最核心的程序 IE 浏览器内核 Trident内核,也是俗称的IE内核Chrome 浏览器内核 统称为 Chromium 内核或 ...
- 使用Web Workers处理线程
使用HTML 4和JavaScript创建出来的Web程序中,因为所有的处理都是在单线程中 HTML 5的Web Workers API,HTML 5中,一个Worker实际上为一个后台运行的线程.
- web workers工作线程
web worker工作线程是Html5里面提出来的一个新api,对于JavaScript我们的印象是单线程执行,如果运行复杂运算的时候,页面可能就会失去响应,是运行在后台的javascript,独立 ...
- Webpack 下使用 web workers 及 基本原理 和 应用场景
_ 阅读目录 一:web workers的基本原理 二:web Workers 的基本用法 三:在webpack中配置 Web Workers 四:Web Worker的应用场景 回到顶部 一:web ...
- 通过使用Web Workers,Web应用程序可以在独立于主线程的后台线程中,运行一个脚本操作。这样做的好处是可以在独立线程中执行费时的处理任务,从而允许主线程(通常是UI线程)不会因此被阻塞/放慢。
Web Workers API - Web API 接口参考 | MDNhttps://developer.mozilla.org/zh-CN/docs/Web/API/Web_Workers_API ...
- 简单了解Web Workers API
1. 为什么使用Web Workers API 通过使用该API,web应用程序可以独立于主线程,运行一个单独的线程来处理脚本. 可以在独立的线程中解决耗时较长的任务,避免主线程阻塞. 2. 应用 1 ...
- html5 Web Workers
虽然在JavaScript中有setInterval和setTimeout函数使javaScript看起来好像使多线程执行,单实际上JavaScript使单线程的,一次只能做一件事情(关于JavaSc ...
- JavaScript是如何工作的:Web Workers的构建块 + 5个使用他们的场景
摘要: 理解Web Workers. 原文:JavaScript是如何工作的:Web Workers的构建块 + 5个使用他们的场景 作者:前端小智 Fundebug经授权转载,版权归原作者所有. 这 ...
- Web Workers文档
Web Worker为Web内容在后台线程中运行脚本提供了一种简单的方法.线程可以执行任务而不干扰用户界面.此外,他们可以使用XMLHttpRequest执行 I/O (尽管responseXML和 ...
随机推荐
- laravel5.2总结--关联关系
参考文章 http://laravelacademy.org/post/1095.html http://laravelacademy.org/post/1174.html http://d.lar ...
- 使用 Spirit 类在 XNA 中创建游戏中的基本单位精灵(十三)
平方已经开发了一些 Windows Phone 上的一些游戏,算不上什么技术大牛.在这里分享一下经验,仅为了和各位朋友交流经验.平方会逐步将自己编写的类上传到托管项目中,没有什么好名字,就叫 WPXN ...
- python 字符编码与转码
一. 字符编码 ASCII: 一个字节,最多能表示255个字符 GB2312(1980年):一共收录了7445个字符,包括6763个汉字和682个其它符号. GBK1.0(1995年):收录了2188 ...
- [oldboy-django][5python基础][高级特性]generator生成器
# 生成器基础 - 定义 在循环的时候不断推算下一个元素的值,而不是一下子创建空间存储所有元素,这样节省空间. 并且在适当的条件结束循环,这种一边循环一边计算的机制,称为generator生成器 - ...
- tomcat 服务不支持 chkconfig 以及其他服务不能添加到开机启动时的操作
在安装完tomcat后想添加的开机自启动的操作,但是报错tomcat 服务不支持 chkconfig,后来在 /etc/init.d/tomcat中的#!/bin/bash后添加上#chkconfi ...
- android AsyncTask使用限制
由于AsyncTask内部是使用线程池(ThreadPoolExecutor)来管理要处理的任务的,所以AsyncTask的弊端就非常明确了:要extcute的任务数量超过线程池最大容量时,必然会报错 ...
- POJ 2836:Rectangular Covering(状态压缩DP)
题目大意:在一个平面内有若干个点,要求用一些矩形覆盖它们,一个矩形至少覆盖两个点,可以相互重叠,求矩形最小总面积. 分析: 数据很小,很容易想到状压DP,我们把点是否被覆盖用0,1表示然后放在一起得到 ...
- BZOJ 4827 [Shoi2017]分手是祝愿 ——期望DP
显然,考虑当前状态最少需要几步,直接贪心即可. 显然我们只需要考虑消掉这几个就好了. 然后发现,关系式找出来很简单,是$f(i) f(i+1) f(i-1)$之间的. 但是计算的时候并不好算. 所以把 ...
- openssl-1.0.1c交叉编译动态库(转)
linux编译相关(13) 版权声明:本文为博主原创文章,未经博主允许不得转载. #交叉编译openssl ------直接修改Makefile新加这一行:CROSS_COMPILE= arm-un ...
- ionic2添加自定义文字
上次更新到如何添加自定义图标,紧接着这次更新ionic2如何添加自定义字体 首先你要有自己的字体文件以.ttf结尾的文件字体 :推荐个字体文件网站(相对来说流氓软件比较少的)http://www.ps ...