如何使用 wx.onSocketOpen 监听 WebSocket 连接打开事件？

推荐答案

// www.javascriptcn.com code example
wx.connectSocket({
  url: 'wss://example.com/socket'
});

wx.onSocketOpen(function(res) {
  console.log('WebSocket连接已打开');
  // 在这里可以执行连接成功后的操作，例如发送消息
  wx.sendSocketMessage({
    data: 'Hello, WebSocket!'
  });
});

本题详细解读

1. 使用 wx.connectSocket 建立 WebSocket 连接

在微信小程序中，首先需要使用 wx.connectSocket 方法来建立 WebSocket 连接。该方法接受一个对象作为参数，其中 url 属性指定 WebSocket 服务器的地址。

wx.connectSocket({
  url: 'wss://example.com/socket'
});

2. 使用 wx.onSocketOpen 监听连接打开事件

当 WebSocket 连接成功建立后，微信小程序会触发 wx.onSocketOpen 事件。你可以通过监听这个事件来执行连接成功后的操作。

wx.onSocketOpen(function(res) {
  console.log('WebSocket连接已打开');
  // 在这里可以执行连接成功后的操作，例如发送消息
  wx.sendSocketMessage({
    data: 'Hello, WebSocket!'
  });
});

3. 在 wx.onSocketOpen 回调函数中执行操作

在 wx.onSocketOpen 的回调函数中，你可以执行一些连接成功后的操作，例如发送消息到服务器。使用 wx.sendSocketMessage 方法可以向服务器发送消息。

wx.sendSocketMessage({
  data: 'Hello, WebSocket!'
});

4. 注意事项

• wx.onSocketOpen 是一个全局事件监听器，一旦设置，会在每次 WebSocket 连接打开时触发。
• 如果你需要在特定页面监听 WebSocket 事件，建议在页面的 onLoad 生命周期函数中设置监听器，并在 onUnload 中移除监听器，以避免内存泄漏。

// www.javascriptcn.com code example
Page({
  onLoad: function() {
    wx.onSocketOpen(function(res) {
      console.log('WebSocket连接已打开');
    });
  },
  onUnload: function() {
    wx.offSocketOpen(); // 移除监听器
  }
});