websocket vue操作

复制代码
let websocket: WebSocket;
/** websocket测试 */
function connectWebsocket() {
  if (typeof WebSocket === "undefined") {
    console.log("您的浏览器不支持WebSocket");
    return;
  }

  // let ip = window.location.hostname + ":8080";
  let ip = "10.192.30.161:8080";
  let url = `ws://${ip}/websocket/download`;
  // 打开一个websocket
  websocket = new WebSocket(url);

  // 建立连接
  websocket.onopen = () => {
    console.log("websocket已连接");
    // websocket.send("ping");
  };
  // 客户端接收服务端返回的数据
  websocket.onmessage = (evt) => {
    let data = evt.data
    console.log("websocket返回的数据:", data);
    if (data.length > 0) {
      handleSearch();
    }
  };
  // 发生错误时
  websocket.onerror = (evt) => {
    console.log("websocket错误:", evt);
  };
  // 关闭连接
  websocket.onclose = (evt) => {
    console.log("websocket关闭:", evt);
  };
}
connectWebsocket();

// 监听窗口关闭事件,当窗口关闭时,主动去关闭websocket连接,防止连接还没断开就关闭窗口,server端会抛异常。
window.onbeforeunload = function () {
  websocket.close();
}
相关推荐
agent8972 天前
实战升级|SpringBoot WebSocket实现多轮对话AI流式问答(上下文记忆+自动重连+会话隔离)
人工智能·spring boot·websocket
sunywz4 天前
【从零搭建物联网智能充电桩系统】4、Netty WebSocket 服务:小程序实时推送背后的长连接管理
物联网·websocket·小程序
贾天佑忆月 迷失的昵6 天前
客户端与服务器持续同步解析(轮询,comet,WebSocket)
运维·服务器·websocket
李昊哲小课6 天前
fastapi sse websocket 奶茶店实时订单看板
人工智能·python·websocket·网络协议·fastapi·sse
李昊哲小课7 天前
fastapi sse websocket 智能家居实时控制台
python·websocket·智能家居·fastapi·sse
花生了什么事o7 天前
WebSocket 与 SSE:实时通信方案的选择
网络·websocket·网络协议
paopaokaka_luck7 天前
基于springboot3+vue3的乡村医生诊疗管理系统(AI助手、协同过滤算法、webSocket实时聊天、Echarts图形化分析)
前端·网络·人工智能·spring boot·websocket·网络协议·echarts
为啥全要学7 天前
fastapi websocket全双工通信
websocket·网络协议·fastapi
fpcc8 天前
c++应用网络编程之十七WebSocket
网络·c++·websocket
半夢半醒110 天前
一种FreeSWITCH流量镜像WebSocket音频推流方案
websocket·网络协议·音视频