微信小程序通过官方内置函数实现WebSocket

目前微信小程序做WebSocket并不需要第三方依赖
官方有提供wx.connectSocket方法来实现建立链接的方式
参考代码如下

// 在页面的逻辑代码中调用 wx.connectSocket 连接 WebSocket
wx.connectSocket({
  url: 'wss://example.com/socket',  // WebSocket 服务器的地址
  success: function () {
    console.log('WebSocket 连接成功');
  },
  fail: function () {
    console.log('WebSocket 连接失败');
  }
});

// 监听 WebSocket 连接成功事件
wx.onSocketOpen(function () {
  console.log('WebSocket 连接已打开');
});

// 监听 WebSocket 接收到服务器的消息事件
wx.onSocketMessage(function (res) {
  console.log('收到服务器的消息：', res.data);
});

// 监听 WebSocket 连接关闭事件
wx.onSocketClose(function () {
  console.log('WebSocket 连接已关闭');
});

// 监听 WebSocket 错误事件
wx.onSocketError(function (res) {
  console.log('WebSocket 错误：', res);
});

// 发送消息给服务器
wx.sendSocketMessage({
  data: 'Hello, server!'
});
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35

如果你想一开始就发送数据可以像我这样写

const socket = wx.connectSocket({
  url: 'wss://ws-api.turingapi.com/api/v2',
  header: {
    'content-type': 'application/json',
  },
  success: function() {
    console.log('WebSocket链接成功');
  },
  fail: function() {
    console.log('WebSocket连接失败');
  }
});
socket.onOpen(function() {
  console.log('WebSocket连接已建立');
  
  socket.send({
    data: JSON.stringify(data),
  });
});

socket.onMessage((res) => {
  console.log('收到消息:', res.data);
});
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23

这样的用法好处在于不需要引入什么依赖