轮询、长轮询与Web Socket的前端实现
Web Socket
应用场景:实现即时通讯:如股票交易行情分析、聊天室、在线游戏等,替代轮询和长轮询
轮询
轮询是在特定的的时间间隔(如每1秒),由浏览器对服务器发出HTTP request,然后由服务器返回最新的数据给客户端的浏览器。这种传统的HTTP request 的模式带来很明显的缺点 – 浏览器需要不断的向服务器发出请求,然而HTTP request 的header是非常长的,里面包含的有用数据可能只是一个很小的值,这样会占用很多的带宽。
var xhr = new XMLHttpRequest();setInterval(function(){xhr.open('GET','/user');xhr.onreadystatechange = function(){};xhr.send();},1000)
长轮询:
ajax实现:在发送ajax后,服务器端会阻塞请求直到有数据传递或超时才返回。 客户端JavaScript响应处理函数会在处理完服务器返回的信息后,再次发出请求,重新建立连接。
function ajax(){var xhr = new XMLHttpRequest();xhr.open('GET','/user');xhr.onreadystatechange = function(){ajax();};xhr.send();}
Web Socket:
轮询与长轮询都是基于HTTP的,两者本身存在着缺陷:轮询需要更快的处理速度;长轮询则更要求处理并发的能力;两者都是“被动型服务器”的体现:服务器不会主动推送信息,而是在客户端发送ajax请求后进行返回的响应。而理想的模型是"在服务器端数据有了变化后,可以主动推送给客户端",这种"主动型"服务器是解决这类问题的很好的方案。Web Sockets就是这样的方案。
//需要先npm install ws//服务器端
var Server = require('ws').Server;
var wss = new Server({port:2000
});
wss.on('connection',function(ws){ws.on('message',function(data){ws.send('你好,客户端,我是服务器!');console.log(data);})
});//node客户端var WebSocket = require('ws');
var socket = new WebSocket('ws://localhost:2000/');
socket.on('open',function(){socket.send('你好,服务器,我是客户端');
});
socket.on('message',function(event){console.log(event);
})//html客户端(注:浏览器客户端与node客户端只需要一种)<script>var socket = new WebSocket('ws://localhost:2000');socket.addEventListener('open', function (event) {socket.send('Hello Server!');});// Listen for messagessocket.addEventListener('message', function (event) {console.log('Message from server ', event.data);});
</script>
轮询、长轮询与Web Socket的前端实现相关推荐
- ajax使用频率,AJAX轮询频率 - 要长期轮询还是不轮询长轮询?
我正在构建一个需要相对不变的数据库轮询的网页组件.我可以看到两种不同的方法,我想知道他们中的一个是否比其他人好,或者如果我错过了第三个选择.AJAX轮询频率 - 要长期轮询还是不轮询长轮询? 1)发送 ...
- 轮询 长轮询 websocket
轮询 特点:每隔一段时间不短向后端发送请求 缺点:消耗大,延迟 from flask import Flask,render_template,request,jsonifyapp = Flask(_ ...
- ajax长轮询tornado,Tornado长轮询和WebSocket
Http协议是一种请求响应式协议, 不允许服务端主动向客户端发送信息. 短轮询是一种简单的实现服务端推送消息的解决方案, 客户端以一定间隔自动向服务端发送刷新请求, 服务端返回要推送的消息作为响应. ...
- Ajax轮询,Ajax长轮询和websockte
http协议介绍: http协议是请求响应式的,每个http相应都对应一个http请求,http协议是没有状态的,多个http协议之间是没有关系的. http协议的被动性:在标准的http语义中,浏览 ...
- java 实现长轮询(LongPolling)
java长轮询 pull,push的区别 区别 发起方不同 时效性不同 对于服务端和客户端的资源消耗 数据处理负责人 总结 长轮询 java代码 Controller inner.doPollingC ...
- 服务器推送技术之短轮询、长轮询、SSE和Websocket
服务器推送技术 服务器推送技术干嘛用?就是让用户在使用网络应用的时候,不需要一遍又一遍的去手动刷新就可以及时获得更新的信息.大家平时在上各种视频网站时,对视频节目进行欢乐的吐槽和评论,会看到各种弹幕, ...
- 实时响应数据之短轮询和长轮询
实时响应数据 在Web应用开发中,我们会经常需要实时响应数据,例如:网页聊天室.实时更新网页在线人数等很多的应用场景.我们前后端数据的交互,通常使用ajax进行交互,所以下面的两种方法都是基于ajax ...
- 从RocketMQ看长轮询(Long Polling)
前言 消息队列一般在消费端都会提供push和pull两种模式,RocketMQ同样实现了这两种模式,分别提供了两个实现类:DefaultMQPushConsumer和DefaultMQPullCons ...
- Web 通信 之 长连接、长轮询(long polling)
Web 通信 之 长连接.长轮询(long polling) 基于HTTP的长连接,是一种通过长轮询方式实现"服务器推"的技术,它弥补了HTTP简单的请求应答模式的不足,极大地增强 ...
最新文章
- 机器学习笔记:向量自回归模型VAR
- 轴固定位置_3轴、3+2轴、5轴加工都有哪些区别?这篇文章给你整明白
- boost::gil模块数字扩展中的 resize_view() 示例
- android 语音通信,Android与PC间的语音通信
- oracle 实时查询最耗CPU资源的SQL语句
- 小b删列(51Nod-2523)
- pdf虚拟打印机下载win7_虚拟打印机(smartprinter) v4.2官方版
- 报表性能优化方案之单数据集分页SQL实现层式报表
- 海康/大华实现web直播和回放,也可以直接对接摄像头
- Win11改Win10右键菜单
- spring boot 请求转发和重定向
- Computer Networking——transport layer QA
- vnc远程控制软件配置,vnc远程控制软件怎么配置的,教程详解
- Python实现淘宝准点抢单!双十一秒杀神器啊!还不来学?
- 英语语法 第一章 句子的形成——概说
- JavaWeb的学习(上)
- 在idea中如何设置项目编码为UTF-8?
- 乐符识别matlab,GitHub - Nuullll/music-synthesizer: Homework No.1 for summer course: MATLAB
- c++ 小游戏 NO6 跑酷游戏
- maven surefire的executions配置
热门文章
- [转载] Java 重写paint绘图
- 递归反转链表改变原链表吗_在不使用递归的情况下找到链表的长度
- java后台json传递,后台json传递
- linux 安装nfs 客户端,在CentOS 7上安装NFS服务器和客户端
- h5引入json_Vue中如何使用本地Json文件?
- python饼形图_Python | 饼形图
- getsimplename_Java类类getSimpleName()方法的示例
- codejam题目_嵌套深度-Google CodeJam 2020资格回合问题解决方案
- python里x.pow2_带有Python示例的math.pow()方法
- 秒建一个后台管理系统?用这5个开源免费的Java项目就够了