什么是websocket

WebSocket是一种在单个TCP连接上进行全双工通信的协议。

WebSocket使得客户端和服务器之间的数据交换变得更加简单，允许服务端主动向客户端推送数据。在WebSocket API中，浏览器和服务器只需要完成一次握手，两者之间就直接可以创建持久性的连接，并进行双向数据传输。

应用场景

在客户端之间可以实现实时通讯，可用于聊天室，多屏互动，心跳检测等互动场景中。

web连接方式

var wsImp = window.WebSocket || window.MozWebSocket || null;
    window.ws = new wsImp('ws://127.0.0.1:11341/');
// 建立连接
ws.onopen = function () {
    var jsonStr = JSON.stringify({"type": "open", "msg": "开启"});
    // 发送信息
    ws.send(jsonStr);
};
// 接收信息
ws.onmessage = function (evt) {
    console.log(evt.data);
};
// 关闭连接
ws.onclose = function () {
};
// 连接错误
ws.onerror = function(event) {
};

小程序连接方式

const io = require('../../utils/weapp.socket.io.js')
socket = io('https://xxxxx',{
    path: '/socketIO'
})
socket.on('connect', () => {
     // 接收信息
     socket.on(key, (data) => {

     });
    // 发送信息 
    socket.emit(key, data)
})

前面文章只是对websocket做了一个简单的介绍和基本的连接方式演示，如果都顺利的话，恭喜你，不需要再往下看了😄。安心在完成你的业务代码就行了。 但现实是往往不是那么顺利，本篇文章主要介绍在连接过程中可能会遇到的问题。

报错信息

VM31670 asdebug.js:1 WebSocket connection to 'wss://XXX/socketIO/?EIO=3&transport=websocket' failed: Invalid frame header(env: macOS,mp,1.05.2204250; lib: 2.19.4)

此类报错主要是由于客户端和服务端引入的socket.io的版本不一致导致的. 待续...