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();
}
相关推荐
看,未来1 天前
Apipost 与 Postman 工具实践指南:WebSocket调试与动态参数测试
websocket·测试工具·postman
哑巴语天雨1 天前
前端面试-网络协议篇
websocket·网络协议·http·面试·https
绿色果酱1 天前
利用Postman和Apipost进行WebSocket调试和文档设计
websocket·测试工具·yapi·postman
ktkiko111 天前
Websocket——心跳检测
网络·websocket·网络协议
KeLin&2 天前
ESP32 websocket-client
网络·websocket·网络协议
楠枬2 天前
网页五子棋——匹配模块
java·spring boot·websocket
我这一生如履薄冰~2 天前
简单封装一个websocket构造函数
前端·javascript·websocket
楠枬2 天前
网页五子棋——对战后端
java·开发语言·spring boot·websocket·spring
闲猫3 天前
go 网络编程 websocket gorilla/websocket
开发语言·websocket·golang
老友@3 天前
OnlyOffice:前端编辑器与后端API实现高效办公
前端·后端·websocket·编辑器·onlyoffice