WebSocket实战:APP和网页通信

深山问
1,840 阅读3分钟

基于Swift的WebSocket框架:Starscream, 用Node.js搭建后台，实现WebSocket互相通信的Demo，项目地址: SSRWebSocket

启动

  1. npm install ws

  2. node websocket.js 开启WebSocket服务

  3. 运行APP(Run会自动打开一个client.html)就可以聊天了

概念

WebSocket是基于TCP协议，全双工通信技术，可以实现服务端和客户端互相通信。

特点:

  1. 基于TCP传输协议, 复用HTTP的握手通道
  2. 与HTTP协议有良好的兼容性,默认端口也是80(ws:)和443(wss:), 并且握手阶段采用HTTP协议, 因为握手时不容易比屏蔽，能通过各种HTTP代理服务器。
  3. 数据格式比较轻量，性能开销小，通信高效
  4. 可以发送文本，也可以发送二进制文件,
  5. 双方都可主动关闭链接
  6. 协议标识是ws或wss(加密), 如ws://localhost:80

WebSocket的局限性

  1. WebSocket实现可伸缩性更难 在HTTP的通信系统中，通过负载均衡做伸缩。而WebSocket只进行一次HTTP连接
  2. WebSocket长连接的心跳保持比较复杂 WebSocket长连接是基于Ping/Pong的心跳机制来维持。

WebSocket的通信过程

  1. 首先由客户端发起HTTP请求，在请求头Heade里面增加一个Upgrade:websocket字段，表示要升级协议到WebSocket。

    客户端请求报文及实现 客户端请求报文:

    GET / HTTP/1.1
Upgrade: websocket
Connection: Upgrade
Host: example.com
Origin: http://example.com
Sec-WebSocket-Key: sN9cRrP/n9NdMgdcy2VJFQ==
Sec-WebSocket-Version: 13

    与传统报文不同的地方:

    Upgrade: websocket
Connection: Upgrade

    下面两行表示webscoket协议的信息

    Sec-WebSocket-Key: sN9cRrP/n9NdMgdcy2VJFQ==   // 随机生成
Sec-WebSocket-Version: 13

  2. 服务端在收到后就会响应一个握手的确认, 发送101 switching Protocols表示允许客户端用WebSocket协议。

    服务端响应报文

    HTTP/1.1 101 Switching Protocols
Upgrade: websocket
Connection: Upgrade
Sec-WebSocket-Accept: HSmrc0sMlYUkAGmm5OPpG2HaGWk=
Sec-WebSocket-Protocol: chat

  3. 至此双端就可以互相发送消息了。

    WebSocket只需要一次HTTP握手

WebSocket端点的4个生命周期

  • 打开事件：此事件发生在端点建立新连接，并且在任何其他事件发生之前。

  • 消息事件: 此事件接收WebSocket对话中另外一端发送的消息。它可以发生在WebSocket端点接收了打开事件之后并且在接收关闭事件关闭连接之前的任一时刻。

  • 错误事件: 此事件在WebSocket连接或者端点发生错误时产生。

  • 关闭事件: 此事件表示WebSocket端点的连接目前正在部分地关闭，它可以由参与的任一连接发出。

常见问题?

  1. Socket死链

    Socket死链是指Socket链接过程中，一方关闭后，另外一方一直等待的过程中，会造成资源的浪费。

    通过心跳机制来处理，即固定时间内由客户端像服务端发送心跳命令，让服务端知道该客户端还存活。

  2. WebSocket的Ping 和 Pong的含义？

    长连机制，Ping由客户端告诉服务端自己还存活，Pong由服务端告诉客户端自己存活

Reference

Swift版本的WebSocket框架Starscream

Node.js实现WebSocket聊天室的例子

avatar
文章
阅读
粉丝