HTML5实现WebSocket协议原理浅析


Posted in HTML / CSS onJuly 07, 2014

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

如果服务器理解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

此时HTTP连接分解并取代了WebSocket连接在同一底层TCP / IP连接。WebSocket连接使用HTTP(80)和HTTPS端口一样(443),默认情况下。

连接建立后,WebSocket数据帧可以发送客户机和服务器之间来回在全双工模式下。两种文本和二进制帧可以在两个方向同时发送。只有两个字节数据最小陷害。对于文本帧,每一帧始于0 x00字节,以0 xff字节结束,包含utf - 8数据。WebSocket文本框架使用一个终结者,而二进制帧使用前缀长度。

HTML / CSS 相关文章推荐
利用CSS3实现炫酷的飞机起飞动画
Sep 17 HTML / CSS
35款精致的 CSS3 和 HTML5 网页模板 推荐
Aug 03 HTML / CSS
css3绘制天猫logo实现代码
Nov 06 HTML / CSS
纯css3实现照片墙效果
Dec 26 HTML / CSS
一款基于css3和jquery实现的动画显示弹出层按钮教程
Jan 04 HTML / CSS
用HTML5实现手机摇一摇的功能的教程
Oct 30 HTML / CSS
html5 web本地存储将取代我们的cookie
Dec 26 HTML / CSS
用html5的canvas画布绘制贝塞尔曲线完整代码
Aug 14 HTML / CSS
5 个强大的HTML5 API 函数推荐
Nov 19 HTML / CSS
HTML5 画布canvas使用方法
Mar 18 HTML / CSS
使用HTML5 Canvas为图片填充颜色和纹理的教程
Mar 21 HTML / CSS
Html5调用手机摄像头并实现人脸识别的实现
Dec 21 HTML / CSS
HTML5新增的表单元素和属性实例解析
Jul 07 #HTML / CSS
HTML5+CSS3实现拖放(Drag and Drop)示例
Jul 07 #HTML / CSS
html5的自定义data-*属性与jquery的data()方法的使用
Jul 02 #HTML / CSS
Html5新特性用canvas标签画多条直线附效果截图
Jun 30 #HTML / CSS
HTML5通过调用canvas对象的getContext()方法来获取绘图环境
Jun 23 #HTML / CSS
HTML5在canvas中绘制复杂形状附效果截图
Jun 23 #HTML / CSS
HTML5 在canvas中绘制矩形附效果图
Jun 23 #HTML / CSS
You might like
让这部DC动画新作刷新你的认知
2020/03/03 欧美动漫
Godaddy空间Zend Optimizer升级方法
2010/05/10 PHP
简单说说PHP优化那些事(经验分享)
2014/11/27 PHP
学习php设计模式 php实现适配器模式
2015/12/07 PHP
如何将一个String和多个String值进行比较思路分析
2013/04/22 Javascript
jqGrid随窗口大小变化自适应大小的示例代码
2013/12/28 Javascript
Ext4.2的Ext.grid.plugin.RowExpander无法触发事件解决办法
2014/08/15 Javascript
jquery操作 iframe的方法
2014/12/03 Javascript
浅谈Javascript 数组与字典
2015/01/29 Javascript
js获取数组的最后一个元素
2015/04/14 Javascript
JS创建对象几种不同方法详解
2016/03/01 Javascript
javascript制作照片墙及制作过程中出现的问题
2016/04/04 Javascript
javascript实现抽奖程序的简单实例
2016/06/07 Javascript
Angular.js中ng-if、ng-show和ng-hide的区别介绍
2017/01/20 Javascript
详解vuelidate 对于vueJs2.0的验证解决方案
2017/03/09 Javascript
老生常谈javascript中逻辑运算符&&和||的返回值问题
2017/04/13 Javascript
JS库之Three.js 简易入门教程(详解之一)
2017/09/13 Javascript
详解JavaScript的BUG和错误
2018/05/07 Javascript
Vue.js 实现微信公众号菜单编辑器功能(一)
2018/05/08 Javascript
vue递归获取父元素的元素实例
2020/08/07 Javascript
[59:48]DOTA2-DPC中国联赛 正赛 VG vs Magma BO3 第一场 1月26日
2021/03/11 DOTA
python用Pygal如何生成漂亮的SVG图像详解
2017/02/10 Python
使用pytorch实现可视化中间层的结果
2019/12/30 Python
给女儿的表扬信
2014/01/18 职场文书
致跳高运动员加油稿
2014/02/12 职场文书
《雷鸣电闪波尔卡》教学反思
2014/02/23 职场文书
跳槽求职信范文
2014/05/26 职场文书
小学语文教研活动总结
2014/07/01 职场文书
县委常委班子对照检查材料思想汇报
2014/09/28 职场文书
贷款担保书
2015/01/20 职场文书
艺术节开幕词
2015/01/28 职场文书
MySQL Shell的介绍以及安装
2021/04/24 MySQL
python3实现Dijkstra算法最短路径的实现
2021/05/12 Python
Python 处理表格进行成绩排序的操作代码
2021/07/26 Python
Java设计模式中的命令模式
2022/04/28 Java/Android
插件导致ECharts被全量引入的坑示例解析
2022/09/23 Javascript