HTML5实现WebSocket协议原理浅析_html5教程技巧
程序员文章站
2022-03-20 19:04:59
...
WebSocket协议的目的是为了工作于现有的网络基础设施。作为这一设计原则的一部分,WebSocket连接的协议规范定义了一个HTTP连接作为其开始生命周期,进而保证其与pre-WebSocket世界的完全向后兼容。通常来说从HTTP协议切换WebSocket称为WebSocket握手。
浏览器发送一个请求到服务器,这表明它想开关从HTTP WebSocket协议。客户端通过升级标题表达的愿望,代码如下所示:
复制代码
代码如下:GET ws://echo.websocket.org/?encoding=text HTTP/1.1
Origin: http://websocket.org
Cookie: __utma=99as
Connection: Upgrade
Host: echo.websocket.org
Sec-WebSocket-Key: uRovscZjNol/umbTt5uKmw==
Upgrade: websocket
Sec-WebSocket-Version: 13
Origin: http://websocket.org
Cookie: __utma=99as
Connection: Upgrade
Host: echo.websocket.org
Sec-WebSocket-Key: uRovscZjNol/umbTt5uKmw==
Upgrade: websocket
Sec-WebSocket-Version: 13
如果服务器理解WebSocket协议,它通过升级头同意协议切换。
复制代码
代码如下:HTTP/1.1 101 WebSocket Protocol Handshake
Date: Fri, 10 Feb 2012 17:38:18 GMT
Connection: Upgrade Server: Kaazing Gateway
Upgrade: WebSocket
Access-Control-Allow-Origin: http://websocket.org
Access-Control-Allow-Credentials: true
Sec-WebSocket-Accept: rLHCkw/SKsO9GAH/ZSFhBATDKrU=
Access-Control-Allow-Headers: content-type
Date: Fri, 10 Feb 2012 17:38:18 GMT
Connection: Upgrade Server: Kaazing Gateway
Upgrade: WebSocket
Access-Control-Allow-Origin: http://websocket.org
Access-Control-Allow-Credentials: true
Sec-WebSocket-Accept: rLHCkw/SKsO9GAH/ZSFhBATDKrU=
Access-Control-Allow-Headers: content-type
此时HTTP连接分解并取代了WebSocket连接在同一底层TCP / IP连接。WebSocket连接使用HTTP(80)和HTTPS端口一样(443),默认情况下。
连接建立后,WebSocket数据帧可以发送客户机和服务器之间来回在全双工模式下。两种文本和二进制帧可以在两个方向同时发送。只有两个字节数据最小陷害。对于文本帧,每一帧始于0 x00字节,以0 xff字节结束,包含utf - 8数据。WebSocket文本框架使用一个终结者,而二进制帧使用前缀长度。
下一篇: 深度解析响应式布局
推荐阅读
-
HTML5实现WebSocket协议原理浅析
-
html5配合css3实现带提示文字的输入框(摆脱js)_html5教程技巧
-
html5指南-4.使用Geolocation实现定位功能_html5教程技巧
-
HTML5边玩边学(1)画布实现方法 _html5教程技巧
-
html5 实现客户端验证上传文件的大小(简单实例)_html5教程技巧
-
html5配合css3实现带提示文字的输入框(摆脱js)_html5教程技巧
-
使用css创建三角形 使用CSS3创建3d四面体原理及代码(html5实践)_html5教程技巧
-
HTML5边玩边学(1)画布实现方法 _html5教程技巧
-
字中字效果的实现【html5实例】_html5教程技巧
-
HTML5技术实现教程:多屏CSS动画精进技巧_html/css_WEB-ITnose