回顾上一章
在上一章《为什么我们需要 HTML 5 WebSocket》中，我 简单 的介绍了下WebSocket的前世今生。相信大家已对WebSocket有了初步的 了解 。那么今天我们继续深入学习WebSocket的机制。
WebSocket机制
我们 知道 WebSocket是HT ML 5一种新的协议。它实现了浏览器与 服务器 全双工通信（不知道的可以看下全双工通信RS-422标准），能更好的 节省 服务器资 源 和 带宽 并达到实时通讯，它建立在TCP之上，同HTTP一样通过TCP来传输数据，但是它和HTTP最大不同是：
WebSocket是一种双向通信协议，在建立连接后，WebSocket服务器和 br owser/Client Agent都能主动的向 对方 发送或接收数据，就像Socket一样；
WebSocket需要类似TCP的客户端和服务器端通过握手连接，连接成功后才能相互通信。
非WebSocket模式传统 HTTP 客户端与服务器的交互如下：
&nbs p;
传统 HTTP 请求响应客户端服务器交互图
使用 WebSocket 模式客户端与服务器的交互如下：
WebSocket 请求响应客户端服务器交互图
根据上面两张图对比可以看出，相对于传统的HTTP每次请求-应答都需要客户端与服务端建立连接的模式，WebSocket是类似Socket的TCP 长连接 的通讯模式，一旦WebSocket连接建立后，后续数据都以帧序列的形式传输。在客户端断开WebSocket连接或Server端断掉连接前，不需要客户端和服务端重新发起连接请求。在海量并发及客户端与服务器交互负载流量大的情况下，极大的节省了网络带 宽 资源的消耗，有明显的性能优势，且客户端发送和接受消息是在同一个持久连接上发起，实时性优势明显。
WebSocket和HTTP的报文
我们再来看看WebSocket通讯与传统HTTP的不同交互的报文：
在客户端(浏览器端js)，创建WebSocket 实例化一个新的 WebSocket 客户端对象，连接类似 ws://yourdom ai n:port/path 的服务端 WebSocket URL，WebSocket 客户端对象会自动解析并识别为 WebSocket 请求，从而连接服务端端口，执行双方握手过程，客户端发送 数据格式 类似：
WebSocket 客户端连接报文
可以看到，客户端发起的 WebSocket 连接报文类似传统 HTTP 报文，]Upgrade：websocket]参数值 表明 这是WebSocket类型请求，[Sec-WebSocket-Key]是WebSocket客户端发送的一个base64编码的密文，要求服务端必须返回一个对应加密的[Sec-WebSocket-Accept]应答，否则客户端会抛出[Error during WebSocket handshake]错误，并关闭连接。
服务端收到报文后返回的数据格式类似：
WebSocket 服务端响应报文
[Sec-WebSocket-Accept]的值是服务端采用与客户端一致的密钥计算出来后返回客户端的,[HTTP/1.1 101 Sw IT ching PR otocols]表示服务端接受WebSocket协议的客户端连接，经过这样的请求-响应处理后，客户端服务端的WebSocket连接握手成功, 后续就可以进行TCP通讯了。
回顾上一章
在上一章《为什么我们需要HTML5 WebSocket》中，我简单的介绍了下WebSocket的前世今生。相信大家已对WebSocket有了初步的了解。那么今天我们继续深入学习WebSocket的机制。
WebSocket机制
我们知道WebSocket是HTML5一种新的协议。它实现了浏览器与服务器全双工通信（不知道的可以看下全双工通信RS-422标准），能更好的节省服务器资源和带宽并达到实时通讯，它建立在TCP之上，同HTTP一样通过TCP来传输数据，但是它和HTTP最大不同是：
WebSocket是一种双向通信协议，在建立连接后，WebSocket服务器和Browser/Client Agent都能主动的向对方发送或接收数据，就像Socket一样；
WebSocket需要类似TCP的客户端和服务器端通过握手连接，连接成功后才能相互通信。
非WebSocket模式传统 HTTP 客户端与服务器的交互如下：
传统 HTTP 请求响应客户端服务器交互图
使用 WebSocket 模式客户端与服务器的交互如下：
WebSocket 请求响应客户端服务器交互图
根据上面两张图对比可以看出，相对于传统的HTTP每次请求-应答都需要客户端与服务端建立连接的模式，WebSocket是类似Socket的TCP长连接的通讯模式，一旦WebSocket连接建立后，后续数据都以帧序列的形式传输。在客户端断开WebSocket连接或Server端断掉连接前，不需要客户端和服务端重新发起连接请求。在海量并发及客户端与服务器交互负载流量大的情况下，极大的节省了网络带宽资源的消耗，有明显的性能优势，且客户端发送和接受消息是在同一个持久连接上发起，实时性优势明显。
WebSocket和HTTP的报文
我们再来看看WebSocket通讯与传统HTTP的不同交互的报文：
在客户端(浏览器端js)，创建WebSocket 实例化一个新的 WebSocket 客户端对象，连接类似 ws://yourdomain:port/path 的服务端 WebSocket URL，WebSocket 客户端对象会自动解析并识别为 WebSocket 请求，从而连接服务端端口，执行双方握手过程，客户端发送数据格式类似：
WebSocket 客户端连接报文
可以看到，客户端发起的 WebSocket 连接报文类似传统 HTTP 报文，]Upgrade：websocket]参数值表明这是WebSocket类型请求，[Sec-WebSocket-Key]是WebSocket客户端发送的一个base64编码的密文，要求服务端必须返回一个对应加密的[Sec-WebSocket-Accept]应答，否则客户端会抛出[Error during WebSocket handshake]错误，并关闭连接。
服务端收到报文后返回的数据格式类似：
WebSocket 服务端响应报文
[Sec-WebSocket-Accept]的值是服务端采用与客户端一致的密钥计算出来后返回客户端的,[HTTP/1.1 101 Switching Protocols]表示服务端接受WebSocket协议的客户端连接，经过这样的请求-响应处理后，客户端服务端的WebSocket连接握手成功, 后续就可以进行TCP通讯了。
觉得 可用，就经常来吧！ 欢迎评论哦！ html5教程 ，巧夺天工，精雕玉琢。小宝典献丑了！
总结
以上是 为你收集整理的 html5教程-HTML5 WebSocket的机制浅析 全部内容，希望文章能够帮你解决 html5教程-HTML5 WebSocket的机制浅析 所遇到的问题。
如果觉得 网站内容还不错， 推荐好友。
查看更多关于html5教程-HTML5 WebSocket的机制浅析的详细内容...