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();
}
相关推荐
sunshine__sun6 天前
JMeter 测试 WebSocket 接口的详细教程
websocket·网络协议·jmeter
bkspiderx7 天前
libwebsockets 服务端获取过代理的真实连接IP
websocket·libwebsockets·过代理的真实连接ip
阿松のblog9 天前
vue3+ts+flask+websocket实现实时异物检测
python·websocket·flask
码侯烧酒11 天前
前端视角下关于 WebSocket 的简单理解
前端·websocket·网络协议
zhoupenghui16812 天前
golang实现支持100万个并发连接(例如,HTTP长连接或WebSocket连接)系统架构设计详解
开发语言·后端·websocket·golang·系统架构·echo·100万并发
小粽子编程13 天前
Pig Cloud遇到websocket不能实现同一个用户不同浏览器接受到广播的消息解决方案
网络·websocket·网络协议
小毛驴85013 天前
WebSocket 在多线程环境下处理 Session并发
网络·websocket·网络协议
yuyu_030414 天前
电子秤利用Websocket做为Client向MES系统推送数据
网络·websocket·网络协议
二闹15 天前
实时数据触手可及!前端开发者必看的连接指南
前端·websocket