小程序websocket开发指南 _websocket

背景：一般与服务端交互频繁的需求，可以使用轮询机制来实现。然而一些业务场景，比如游戏大厅、直播、即时聊天等，这些需求都可以或者说更适合使用长连接来实现，一方面可以减少轮询带来的流量浪费，另一方面可以减少对服务的请求压力，同时也可以更实时的与服务端进行消息交互。
背景知识
HTTP vs WebSocket
名词解释

HTTP：是一个用于传输超媒体文档（如html）的应用层的无连接、无状态协议。
WebSocket：HTML5开始提供的一种浏览器与服务器进行全双工通讯的网络技术，属于应用层协议，基于TCL传输协议，并复用HTTP的握手通道。

文章插图

特点

HTTP
WebSocket建立在TCP协议之上，服务器端的实现比较容易；与HTTP协议有着良好的兼容性。默认端口也是80和443，并且握手阶段采用HTTP协议，因此握手时不容易屏蔽，能通过各种HTTP代理服务器；数据格式比较轻量，性能开销小，通信高效；可以发送文本（text），也可以发送二进制数据（ArrayBuffer）；没有同源限制，客户端可以与任意服务器通信；协议标识符是ws（如果加密，则为wss），服务器网址就是URL；

二进制数组
名词解释

ArrayBuffer?对象：代表原始的二进制数据。代表内存中的一段二进制数据，不能直接读写，只能通过“视图”（?TypedArray?和?DataView?）进行操作（以指定格式解读二进制数据）。“视图”部署了数组接口，这意味着，可以用数组的方法操作内存。
?TypedArray?对象：代表确定类型的二进制数据。用来生成内存的视图，通过9个构造函数，可以生成9种数据格式的视图，数组成员都是同一个数据类型，比如：?Unit8Array?：（无符号8位整数）数组视图?Int16Array?：（16位整数）数组视图?Float32Array?：（32位浮点数）数组视图

?DataView?对象：代表不确定类型的二进制数据。用来生成内存的视图，可以自定义格式和字节序，比如第一个字节是?Uint8?（无符号8位整数）、第二个字节是?Int16?（16位整数）、第三个字节是?Float32?（32位浮点数）等等，数据成员可以是不同的数据类型。

举个栗子
?ArrayBuffer?也是一个构造函数，可以分配一段可以存放数据的连续内存区域

var buf = new ArrayBuffer(32); // 生成一段32字节的内存区域，每个字节的值默认都是0为了读写buf，需要为它指定视图 。

?DataView?视图，是一个构造函数，需要提供?ArrayBuffer?对象实例作为参数：

var dataView = new DataView(buf); // 不带符号的8位整数格式dataView.getUnit8(0) // 0

?TypedArray?视图，是一组构造函数，代表不同的数据格式。

var x1 = new Init32Array(buf); // 32位带符号整数x1[0] = 1;var x2 = new Unit8Array(buf); // 8位不带符号整数x2[0] = 2;x1[0] // 2 两个视图对应同一段内存，一个视图修改底层内存，会影响另一个视图TypedArray(buffer, byteOffset=0, length?)

buffer：必需，视图对应的底层?ArrayBuffer?对象
byteOffset：可选，视图开始的字节序号，默认从0开始，必须与所要建立的数据类型一致，否则会报错

var buffer = new ArrayBuffer(8);var i16 = new Int16Array(buffer, 1);// Uncaught RangeError: start offset of Int16Array should be a multiple of 2

因为，带符号的16位整数需要2个字节，所以byteOffset参数必须能够被2整除。

length：可选，视图包含的数据个数，默认直到本段内存区域结束

note：如果想从任意字节开始解读?ArrayBuffer?对象，必须使用?DataView?视图，因为?TypedArray?视图只提供9种固定的解读格式。
?TypedArray?视图的构造函数，除了接受?ArrayBuffer?实例作为参数，还可以接受正常数组作为参数，直接分配内存生成底层的?ArrayBuffer?实例，并同时完成对这段内存的赋值。
var typedArray = new Unit8Array([0, 1, 2]);typedArray.length // 3typedArray[0] = 5;typedArray // [5, 1, 2]总结
?ArrayBuffer?是一(大)块内存，但不能直接访问?ArrayBuffer?里面的字节。?TypedArray?只是一层视图，本身不储存数据，它的数据都储存在底层的?ArrayBuffer?对象之中，要获取底层对象必须使用buffer属性。其实?ArrayBuffer? 跟 ?TypedArray? 是一个东西，前者是一(大)块内存，后者用来访问这块内存。
Protocol Buffers
我们编码的目的是将结构化数据写入磁盘或用于网络传输，以便他人来读取，写入方式有多种选择，比如将数据转换为字符串，然后将字符串写入磁盘。也可以将需要处理的结构化数据由 .proto 文件描述，用 Protobuf 编译器将该文件编译成目标语言。