HTML5之webSocket使用
webSocket是什么
webSocket是HTML5新出的一种协议,底层是基于TCP/IP协议的。跟http没有关系,只是复用了http握手通道,用来升级协议。
webSocket的作用
轮询:客户端以一定的时间间隔向服务端发出请求,以频繁请求的方式来保持客户端和服务器端的同步。缺点:
- 浏览器需要不断的向服务器发出请求,然而HTTP请求可能包含较长的头部,其中真正有效的数据可能只是很小的一部分,显然这样会浪费很多的带宽等资源。
长轮询:浏览器向服务器发送请求,服务器将请求保持打开一段时间。如果在该时间段内收到通知,则将包含该消息的响应发送到客户端。如果在设定的时间段内未收到通知,则服务器发送响应以终止打开的请求。缺点:
- 当具有较高的消息量时,长轮询不会提供比传统轮询更大的性能改进
- 服务器端会阻塞请求直到有数据传递或超时才返回
使用webSocket浏览器和服务器只需要完成一次握手,两者之间就直接可以创建持久性的连接,并进行双向数据传输。
优点:
- 能更好的节省服务器资源和带宽
- 支持双向通信,实时性更强
- 可以发送文本,也可以发送二进制数据
webSocket的使用
服务端:
var app = require('express')();
var WebSocket = require('ws');
var wss = new WebSocket.Server({ port: 8080 });
wss.on('connection', function connection(ws) {
ws.on('message', function incoming(message) {
console.log(message);
});
ws.send('the content from server');
});
app.listen(3000,() => {
console.log('you are listening port 3000');
});
客户端:
var ws = new WebSocket('ws://localhost:8080');
ws.onopen = function () {
ws.send('the request from client');
};
ws.onmessage = function (e) {
console.log('from server: ' + e.data);
};
webSocket应用场景
社交聊天、弹幕、多玩家游戏、协同编辑、股票基金实时报价、体育实况更新、视频会议/聊天、基于位置的应用、在线教育、智能家居等需要高实时的场景
参考资料:WebSocket:5分钟从入门到精通
HTML5之webSocket使用的更多相关文章
- 认识HTML5的WebSocket
在HTML5规范中,我最喜欢的Web技术就是正迅速变得流行的WebSocket API.WebSocket提供了一个受欢迎的技术,以替代我们过去几年一直在用的Ajax技术.这个新的API提供了一个方法 ...
- HTML5之WebSocket
在HTML5规范中,我最喜欢的Web技术就是正迅速变得流行的WebSocket API.WebSocket提供了一个受欢迎的技术,以替代我们过去几年一直在用的Ajax技术.这个新的API提供了一个方法 ...
- HTML5 的WebSocket
认识HTML5的WebSocket
- 使用Html5下WebSocket搭建简易聊天室
一.Html5WebSocket介绍 WebSocket protocol 是HTML5一种新的协议(protocol).它是实现了浏览器与服务器全双工通信(full-duplex). 现在,很多网站 ...
- HTML5的Websocket(理论篇 I)
HTML5的Websocket(理论篇 I) ** 先请来TA的邻居:** http:无状态.基于tcp请求/响应模式的应用层协议 (A:哎呀,上次你请我吃饭了么? B:我想想, 上次请你吃了么) t ...
- 如何使用HTML5的WebSocket实现网页与服务器的双工通信(二)
本系列服务端双工通信包括两种实现方式:一.使用Socket构建:二.使用WCF构建.本文为使用WCF构建服务端的双工通信,客户端同样使用Html5的WebSocket技术进行调用. 一.创建WCF服务 ...
- 如何使用HTML5的WebSocket实现网页与服务器的双工通信(一)
本系列服务端双工通信包括两种实现方式:一.使用Socket构建:二.使用WCF构建.本文为使用Socket构建服务端的双工通信,客户端同样使用Html5的WebSocket技术进行调用. 一.网页客户 ...
- html5利用websocket完成的推送功能(tomcat)
html5利用websocket完成的推送功能(tomcat) 利用websocket和java完成的消息推送功能,服务器用的是tomcat7.0.42,一些东西是自己琢磨的,也不知道恰不恰当,不恰当 ...
- HTML5 and Websocket
在HTML5规范中,我最喜欢的Web技术就是正迅速变得流行的WebSocket API.WebSocket提供了一个受欢迎的技术,以替代我们过去几年一直在用的Ajax技术.这个新的API提供了一个方法 ...
- 利用html5、websocket和opencv实现人脸检测
最近学习人脸识别相关的东西,在MFC下使用OpenCV做了一个简单的应用.训练需要较多的数据,windows应用程序终究还是不方便,于是想着做成CS模式:检测识别都放在服务器端,视频获取和显示都放在网 ...
随机推荐
- MySQL 复制 - 性能与扩展性的基石 1:概述及其原理
1. 复制概述 MySQL 内置的复制功能是构建基于 MySQL 的大规模.高性能应用的基础,复制解决的基本问题是让一台服务器的数据与其他服务器保持同步. 接下来,我们将从复制概述及原理.复制的配置. ...
- 机器学习——KMeans聚类,KMeans原理,参数详解
0.聚类 聚类就是对大量的未知标注的数据集,按数据的内在相似性将数据集划分为多个类别,使类别内的数据相似度较大而类别间的数据相似度较小,聚类属于无监督的学习方法. 1.内在相似性的度量 聚类是根据数据 ...
- shell-输入与输出<echo, read, cat, tee >
1. echo echo命令可以显示文本行或变量,或者吧字符串输入到文件. 用法:echo [option] string #[option]可选:-e ==>解析转移字符,(常用的\n & ...
- CSharpGL(50)使用Assimp加载骨骼动画
CSharpGL(50)使用Assimp加载骨骼动画 在(http://ogldev.atspace.co.uk/www/tutorial38/tutorial38.html)介绍了C++用Asism ...
- 我们一起来排序——使用Java语言优雅地实现常用排序算法
破阵子·春景 燕子来时新社,梨花落后清明. 池上碧苔三四点,叶底黄鹂一两声.日长飞絮轻. 巧笑同桌伙伴,上学径里逢迎. 疑怪昨宵春梦好,元是今朝Offer拿.笑从双脸生. 排序算法--最基础的算法,互 ...
- Aria2序之导言
aria2是什么,如果此时此刻你看到标题读到第一行正在思索着一个问题,很抱歉 ,这篇以及后续我的blog不适合你,请移步. 我在aria2的官方站点抄袭了如下语句用来充实本文: aria2 is a ...
- 【php性能优化】关于写入文件操作的取舍方案
对于使用php对文件进行写入操作有两种方案一种使用 file_put_contents() 和 fopen()/fwrite()/fclose() 两种方案至于应该怎么选,我觉得应该分情况选择,下面是 ...
- HTML文本框样式大全
粘贴自Christian.Cao 博客园地址 : https://www.cnblogs.com/QQ862668193/p/6893797.html 输入框景背景透明:<input style ...
- css公共库——清除浮动
清除浮动是css的基础,但有时候会忘了一些最简单的东西 浮动因为在文档流之外,所以会造成父元素的坍塌.父元素之后的元素排版就会乱. 常用的方法是在浮动父元素中添加cf类,然后定义cf样式,并将其放在公 ...
- Odoo:全球第一免费开源ERP权威性能测试报告完整版(绝对珍藏)
Odoo平台简介 Odoo(以前叫OpenERP)是世界排名第一的开源ERP系统,最早由比利时一家公司开发,经过十几年发展,目前全世界Odoo的使用者超过2百万人,Odoo被翻译成几十种语言,Odoo ...