通信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和 ...
随机推荐
- 【Two Sum】cpp
题目: Given an array of integers, find two numbers such that they add up to a specific target number. ...
- CSU-2173 Use FFT
CSU-2173 Use FFT Description Bobo computes the product P(x)⋅Q(x)=\(c_0 + c_1x + - + c_{n+m}x^{n + m} ...
- Leetcode 542.01矩阵
01矩阵 给定一个由 0 和 1 组成的矩阵,找出每个元素到最近的 0 的距离. 两个相邻元素间的距离为 1 . 示例 1: 输入: 0 0 0 0 1 0 0 0 0 输出: 0 0 0 0 1 0 ...
- HEAD DETACHED push origin失败问题
先说HEAD HEAD是一个头指针,通常情况下指向不同的分支,每个分支对应一个commit(准确的说,每个分支对应多个commit,但是只有一个顶层的commit,而commit之间是简单的线性关系. ...
- hdu5985[概率dp] 2016青岛icpc现场赛
#include <bits/stdc++.h> using namespace std; ][]; ][]; ][]; ]; ]; int T, n; double fastpow(do ...
- POJ 2104:K-th Number(主席树静态区间k大)
题目大意:对于一个序列,每次询问区间[l,r]的第k大树. 分析: 主席树模板题 program kthtree; type point=record l,r,s:longint; end; var ...
- mysql错误之2014
error:2014 Commands out of sync; you can't run this command now 这个错误号我也真是醉了. 一直纠结于为什么存储过程执行完,commit操 ...
- Codeforces 785D Anton and School - 2 (组合数相关公式+逆元)
D. Anton and School - 2 time limit per test 2 seconds memory limit per test 256 megabytes input stan ...
- 现代互联网的TCP拥塞控制(CC)算法评谈
动机 写这篇文章本质上的动机是因为前天发了一个朋友圈,见最后的写在最后,但实际上,我早就想总结总结TCP拥塞控制算法点点滴滴了,上周总结了一张图,这周接着那些,写点文字. 前些天,Linux中国微信公 ...
- 解决 unity 用 vs通过wifi 真机联调 一直连接不上
平时 在公司网络太差,要通过wifi 用vs真机联调时,vs一直连不上设备,很是蛋疼...用下面官方给出的方法可以解决 Attaching MonoDevelop Debugger To An And ...