Bootstrap

webSocket使用

注意:

每隔固定时间要发送1次心跳 否则会在nginx配的proxy read timeout时间断开(如下图,nginx配置是1分钟没收到客户端信息就会断开)

如果线上服务是https 那对应也必须是wss 否则websocket会连接报错

以下是全部代码示例:
let ws = ref();

let heartbeatIntervalId; // 用于存储 setInterval 的返回值

function startHeartbeat() {
  // 设置定时器,并保存其ID到 heartbeatIntervalId 变量中
  heartbeatIntervalId = setInterval(function () {
    // 发送心跳的数据可以是一个简单的字符串或者JSON对象
    ws.value.send("Heartbeat");
  }, 5000); // 每隔5秒(5000毫秒)发送一次
}

// 关闭定时器 根据业务逻辑在需要的地方调用
function stopHeartbeat() {
  if (heartbeatIntervalId) {
    clearInterval(heartbeatIntervalId); // 使用 clearInterval 来关闭定时器
    heartbeatIntervalId = undefined; // 清除标识符
  }
}

// 用户进出直播间
function wsMethods(liveId, userId) {
  ws.value = new WebSocket(
    `wss://share.zhongzcxin.com/user/userWebSocket/${userId}/${liveId}`
  );

  ws.value.onopen = function () {
    console.log("ws连接成功");
    startHeartbeat();
  };

  ws.value.onmessage = function (event) {
    let data = JSON.parse(event.data);
    // 根据业务逻辑处理服务端返回的信息
  };

  ws.value.onclose = function () {
    console.log("ws连接关闭");
  };

  ws.value.onerror = function (error) {
    console.error("ws连接出错: " + error);
  };
}

;