websocket

WebSocket protocol是H5的一种新协议,实现了浏览器与服务器的全双工通信,所以可以实现web实时交互。并节省了资源和带宽

 

在WebSocket出现之前,一般通过两种方式来实现web实时应用:轮询和流

 

轮询:是一种定时的同步调用,客户端向服务器端以固定时间间隔发送请求,查看是否有更新。如果有新的信息,客户端会得到响应,否则服务器返回一个拒绝响应,客户端关闭连接。

然而实时数据并不总是可预测的,轮询会带来很多不必要的请求,而每次请求都会带有完整的请求头,这样会浪费资源和带宽;轮询是一种低效的实时方案

长轮询(Comet/反向ajax)客户端向服务端发送请求,并保持一段设定的时间,直到服务端有响应或者设定的时间过期,请求才会关闭。之后,客户端会重新向服务器发送请求

 

流:在客户端页面使用一个隐藏的窗口(iframe)向服务器发出一个长连接请求(无限或规定的时间段内,一直保持打开),每当服务器端有更新时,就将信息推送至客户端。

这种方式的缺陷在于:1.要针对不同浏览器改善用户体验。2.服务器不会发送请求完成响应,连接一直打开,对防火墙和代理网络不友好

 

 

websocket:使用javascript调用浏览器API, 发送一个websocket请求到服务器,经过一次握手,和服务器简历TCP通讯。它本质上是一个TCP连接,所以稳定性强、数据传输量小。

 

websocket协议基于TCP协议建立一个websocket连接的步骤:

  1.客户端向服务器发送一个特殊http请求,包含了一些附加头信息("Upgrade:WebSocket"),表明这是一个申请协议升级的http请求。

  2.服务端解析并产生应答信息返回客户端,websocket连接建立成功

  3.连接一直打开,直到B/S端的某一方中关闭连接。

 

常用接口方法和属性:

readyState表示四种连接状态:

0:未连接

1:连接成功,可通讯

2:正在关闭

3:连接已关闭或无法打开

 

url代表websocket的服务器网络地址,协议通常是“ws”或“wss(加密)”;send()发送数据到服务端

close()关闭连接

onopen(),握手成功触发的事件

onmessage(),收到服务器消息时触发

onerror(),异常时触发

onclose(),关闭连接时触发

 

JavaScript调用浏览器接口示例如下:

复制代码
 1 var wsServer = 'ws://localhost:8888/Demo'; //服务器地址
 2 var websocket = new WebSocket(wsServer); //创建WebSocket对象
 3 websocket.send("hello");//向服务器发送消息
 4 alert(websocket.readyState);//查看websocket当前状态
 5 websocket.onopen = function (evt) {
 6 //已经建立连接
 7 };
 8 websocket.onclose = function (evt) {
 9 //已经关闭连接
10 };
11 websocket.onmessage = function (evt) {
12 //收到服务器消息,使用evt.data提取
13 };
14 websocket.onerror = function (evt) {
15 //产生异常
16 }; 
复制代码

 

 

服务器端对websocket的实现:

posted @   tuna-  阅读(2851)  评论(0编辑  收藏  举报
编辑推荐:
· AI与.NET技术实操系列:基于图像分类模型对图像进行分类
· go语言实现终端里的倒计时
· 如何编写易于单元测试的代码
· 10年+ .NET Coder 心语,封装的思维:从隐藏、稳定开始理解其本质意义
· .NET Core 中如何实现缓存的预热?
阅读排行:
· 分享一个免费、快速、无限量使用的满血 DeepSeek R1 模型,支持深度思考和联网搜索!
· 基于 Docker 搭建 FRP 内网穿透开源项目(很简单哒)
· ollama系列01:轻松3步本地部署deepseek,普通电脑可用
· 25岁的心里话
· 按钮权限的设计及实现
点击右上角即可分享
微信分享提示