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();
}
相关推荐
imDwAaY2 天前
WebSocket 和 SSE 有什么区别?从实时通信到 AI 流式输出
后端·websocket
Knight_AL2 天前
基于 Netty 实现的 WebSocket 服务端
网络·websocket·网络协议
sjg200104142 天前
websocket基本使用
网络·websocket
脉动数据行情13 天前
Go 语言实战|对接美股英伟达 NVDA 实时行情 生产级 WebSocket 方案
开发语言·websocket·golang
DP DPharness5 天前
StudyMate 从安装到第一节课的完整操作路径
人工智能·websocket·网络协议·智能手机·dpharness
wangbing11256 天前
开发指南148-WebSocket-前端查报文
网络·websocket·网络协议
liangshanbo12156 天前
前端高级面试题:WebSocket 双向流式通信怎么设计?
前端·websocket·网络协议
wangbing11256 天前
开发指南148-WebSocket-后端
网络·websocket·网络协议
DP DPharness7 天前
手机连不上 DSH 时的排错顺序:从 401 到 WebSocket 放行
websocket·网络协议·智能手机
骑着蜗牛撵大象3278 天前
Agent 打字机是怎么来的:SSE 与 WebSocket 打通实时响应与中间状态
网络·websocket·网络协议·agent·sse·实时通信·流式输出