通信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和 ...
随机推荐
- python如何合并两个字典
我有两个Python字典,如何合并它们呢?update()方法正是你所需要的. >>> x = {'a':1, 'b': 2} >>> y = {'b':10, ' ...
- 递归查询子类sql
--通过父节点查询子节点 WITH TREE AS( SELECT * FROM Role WHERE RoleID = 4 -- 要查询的父 id UNION ALL SELECT Role.* F ...
- 【Combinations】cpp
题目: Given two integers n and k, return all possible combinations of k numbers out of 1 ... n. For ex ...
- 【Copy List with Random Pointer】cpp
题目: A linked list is given such that each node contains an additional random pointer which could poi ...
- centos php环境搭建
CentOS 6.5系统安装配置LAMP(Apache+PHP5+MySQL)服务器环境 准备篇: 1.配置防火墙,开启80端口.3306端口vi /etc/sysconfig/iptables-A ...
- Github新手使用学习详解
Github新手使用学习详解 (一)git的使用学习 首先下载git bash,安装一路默认选择即可. 安装好后第一步,获取ssh key,即属于自己的密钥: 打开Git bash后输入以下代码: $ ...
- hnust 搬书
问题 G: 搬书 时间限制: 1 Sec 内存限制: 128 MB提交: 576 解决: 49[提交][状态][讨论版] 题目描述 XCQ队长要退役啦,由于队长常年刷题,机位上摆着各类算法书,一个 ...
- js日期处理
Js获取当前日期时间及其它操作 var myDate = new Date(); myDate.getYear(); //获取当前年份(2位) myDate.getFullYear(); //获取完整 ...
- openssl-1.0.1c交叉编译动态库(转)
linux编译相关(13) 版权声明:本文为博主原创文章,未经博主允许不得转载. #交叉编译openssl ------直接修改Makefile新加这一行:CROSS_COMPILE= arm-un ...
- git pull命令模式
git pull 默认等于 git fetch + git mergegit pull --rebase 等于 git fetch + git rebasegit pull -–squash 等于 g ...