Bootstrap

vue3使用websocket

开启(具体是什么时候开启根据项目需求来决定)

let websocket = null;

const connectWebSocket = info => {
  // 如果已经存在连接,则先关闭
  if (websocket) {
    websocket.close();
  }
  console.log(info);
  const wsUrl = `ws://your url`;
  // 创建新的 WebSocket 连接
  websocket = new WebSocket(wsUrl);

  websocket.onopen = () => {
    console.log("WebSocket 连接成功");
  };

  websocket.onmessage = event => {
  // 处理收到的消息
  //event.data则是接口返回数据,需要根据接口格式自己去替换然后转成json。我这边暂时是这样处理的
    const val = event.data.replace(/'/g, '"');
    const data = JSON.parse(val);
    message.value = data;
  };

  websocket.onerror = error => {
    console.error("WebSocket 出现错误:", error);
  };

  websocket.onclose = () => {
    console.log("WebSocket 连接关闭");
    // 可以在此处设置重连逻辑
  };
};

关闭

// 一般是组件卸载时断开 WebSocket 连接
onUnmounted(() => {
  if (websocket) {
    websocket.close();
  }
});

疑问

因为websocket是一个不间断的请求,那么会一直存数据,好像会造成浏览器很大的内存影响。这个暂时没想到好的解决办法

;