HTML5技术

用node实现websocket协议 - 2778085001(2)

字号+ 作者:H5之家 来源:博客园 2016-06-25 14:00 我要评论( )

chrome inspector美化过的握手信息: Request URL:ws: //192.168.144.131:4400/pub/chat?q=me Request Method:GETStatus Code: 101 WebSocket Protocol HandshakeRequest HeadersConnection:UpgradeHost: 192.168 .

chrome inspector美化过的握手信息:

Request URL:ws://192.168.144.131:4400/pub/chat?q=me Request Method:GET Status Code:101 WebSocket Protocol Handshake Request Headers Connection:Upgrade Host:192.168.144.131:4400 Origin:http://localhost:800 Sec-WebSocket-Key1:p2 G 947T 80 661 jAf2 Sec-WebSocket-Key2:z Z Q ^= 7s1 1 7H4 Sec-WebSocket-Protocol::my-custom-chat-protocol Upgrade:WebSocket (Key3):7C:44:56:CA:1F:19:D2:0A Response Headers Connection:Upgrade Sec-WebSocket-Location:ws://192.168.144.131:4400/pub/chat?q=me Sec-WebSocket-Origin:http://localhost:800 Sec-WebSocket-Protocol:my-custom-chat-protocol Upgrade:WebSocket (Challenge Response):52:DF:2C:F4:50:C2:8E:98:14:B7:7D:09:CF:C8:33:40

请求头部分

响应头部分

应答字符串计算过程伪代码:

part_1 = key1中所有数字 / key1中空格数量 part_2 同上 sum = big_endian(part_1)+big_endian(part_2)+key3 challenge_response = md5_digest(sum);

32位整数的big_endian计算策略:

# 很类似于rgba颜色计算,从下面的函数可以看出计算过程 [n >> 8*i & 0xff }); } big_endian(0xcc77aaff); // -> [204, 119, 170, 255] 发送数据

WebSocket API的被设计成用事件处理数据,客户端只要得到事件通知就可以获取到完整的数据,而不需要手动处理缓冲器。

这种情况下,每一笔数据被称为一帧。在规范的定义中,它的头部必须以0x00开始,尾部属性以0xff结束,这样每一次数据发送至少有两个字节。

服务器实现中,收到数据时要截掉头尾;而发送数据是要包装头尾。格式如下:

# '你好'的原始二进制表示,请求头和这里都是utf8编码 > # 包装后的二进制表示。 > 参考链接

websocket draft:

w3 websocket api:

whatwg webapp规范:

有趣的交互证明:

附件

查看或下载:https://gist.github.com/1066475

 

1.本站遵循行业规范,任何转载的稿件都会明确标注作者和来源;2.本站的原创文章,请转载时务必注明文章作者和来源,不尊重原创的行为我们将追究责任;3.作者投稿可能会经我们编辑修改或补充。

相关文章
  • HTML5 进阶系列:拖放 API 实现拖放排序 - _林鑫

    HTML5 进阶系列:拖放 API 实现拖放排序 - _林鑫

    2017-05-02 11:02

  • vue-cli webpack在node环境下安装使用 - 孙三峰

    vue-cli webpack在node环境下安装使用 - 孙三峰

    2017-04-23 11:00

  • vue2.0版cnode社区项目搭建及实战开发 - sandisen

    vue2.0版cnode社区项目搭建及实战开发 - sandisen

    2017-04-20 14:00

  • 调取百度地图接口,实现取自己的实时位置,然后可以在百度地图上添加信息标注 - QISHUANG

    调取百度地图接口,实现取自己的实时位置,然后可以在百度地图上添加

    2017-04-18 10:02

网友点评
-