WebSocket是什么？

最新推荐文章于 2023-06-01 19:13:31 发布

迷糊的小小淘

最新推荐文章于 2023-06-01 19:13:31 发布

阅读量458

点赞数 1

分类专栏：前端知识文章标签： websocket 网络 tcp/ip

本文链接：https://blog.csdn.net/ks795820/article/details/129619161

版权

前端知识专栏收录该内容

51 篇文章 5 订阅

订阅专栏

本次教程讲述WebSocket介绍及方法~

前言

WebSocket是HTML5开始提供的一种在单个TCP连接上进行全双工通讯的协议；它的目的是要在浏览器和服务器之间建立一个不受限的双向通信的通道，比如服务器可以在任意时刻发送消息给浏览器；

与HTTP协议的不同

HTTP协议是一种无状态的、无连接的、单向的应用层协议。它采用了请求/响应模型。通信请求只能由客户端发起、服务端对请求作出应答处理-----即HTTP协议无法实现服务器主动向客户端发起消息；

这种单向请求的特点，注定了若服务器有连续的状态变化，客户端要获知就非常麻烦。大多数Web应用程序将通过频繁的异步Ajax请求实现长轮询，该种方法效率低，推送延迟，非常浪费资源（因为必须不停连接，或者HTTP连接始终打开）；

HTTP轮询请求

另外，HTTP长连接中，每次数据交换除了真正的数据部分外，服务器和客户端还要大量交换HTTP header，信息交换效率很低；而Websocket协议通过第一个握手request建立了TCP连接之后，之后交换的数据都不需要发送 HTTP header就能交换数据；

WebSocket

WebSocket并不是全新的协议，而是利用了HTTP协议来建立连接：

为什么WebSocket连接可以实现全双工通信而HTTP连接不行呢：

实际上HTTP协议是建立在TCP协议之上的，TCP协议本身就实现了全双工通信，但是HTTP协议的请求－应答机制限制了全双工通信。WebSocket连接建立以后，其实只是简单规定了一下：接下来，咱们通信就不使用HTTP协议了，直接互相发数据吧。

该协议有两部分：握手和数据传输：

①握手：握手阶段基于http协议，来自客户端的握手看起来像如下形式：

GET ws: //localhost/chat HTTP/1.1
Host: localhost
Upgrade: websocket // 协议升级为WebSocket协议
Connetion: Upgrade // 标识该HTTP请求是一个协议升级请求
Sec-WebSocekt-Key: dcglajglajlganglaego== // 客户端采用base64编码的24位随机字符序列，服务器接受客户端HTTP协议升级的证明，要求服务端响应一个对应加密的Sec-WebSocket-Accept头信息作为应答
Sec-WebSocket-Extension: permessage-deflate // 协议扩展类型
Sec-WebSocket-Version: 13 // 客户端支持Websocket的版本

握手请求成功后服务器发来的响应看起来像如下形式：

HTTP/1.1 101 Switching Protocols // 101表示本次连接的HTTP协议即将被更改
Upgrade: websocket // 更改后的协议就是websocket协议
Connetion: Upgrade
Sec-WebSocekt-Accept: ddlmslsejglajlganglaego==
Sec-WebSocket-Extension: permessage-deflate

②数据传输（客户端实现）

新建一个WebSocket对象

实现WebSocket的Web浏览器将通过WebSocket对象公开所有必须的客户端功能（主要是指支持HTML5的浏览器）；

var ws = new WebSocket(url) // 新建WebSocket对象
// url为websocket服务地址，格式为 ws://ip地址:端口号/资源名称

WebSocket对象相关事件

事件	事件处理程序	描述
open	webSocket对象.onopen	连接建立时触发
message	websocket对象.onmessage	客户端接收服务端数据时触发
error	websocket对象.onerror	通信发生错误时触发
close	websocket对象.onclose	连接关闭时触发