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();
}
相关推荐
Da Da 泓16 小时前
五子棋 Web 端测试用例报告
前端·网络·websocket·网络协议·测试用例·项目
web打印社区2 天前
Chrome-kiosk-printing能上生产吗
开发语言·前端·javascript·chrome·websocket
XiYang-DING4 天前
【WebSocket】文本帧Text Frame
网络·websocket·网络协议
TickDB4 天前
美股历史数据下载:用 Codex 取数,Python 导出 CSV
python·websocket·mcp·行情数据 api
国际云,接待4 天前
云服务器 WebSocket 空闲后频繁断开:查 Nginx 超时、心跳与负载均衡,再评估扩容
服务器·websocket·nginx
青瓦梦滋5 天前
WebSocket协议
linux·服务器·网络·c++·websocket·网络协议·http
山雀~5 天前
WebSocket 断连之后:一次手机采集偶现卡死的排查与修复
网络·websocket·网络协议
砚底藏山河5 天前
python量化:实时行情WebSocket断线重连状态机
java·python·websocket·金融
周厉5 天前
WebSocket 使用场景与实现方法:Java + Vue3 全栈实战
java·websocket·vue3·websocket双向通讯
jaysee-sjc6 天前
【苍穹外卖】Day10:定时任务与 WebSocket 实时提醒实战
java·开发语言·javascript·数据库·vue.js·websocket·网络协议