前端使用webSocket与后台建立连接并进行心跳监测机制

1:前端代码如下
首先项目中需要引入websocket

  // WebSocket对象方法
  getWebSocket(){
    // 创建一个 websocket 连接
    var ws = new WebSocket("ws://10.66.78.118:8085/api/cloud/ws");
    // websocket 创建成功事件
    ws.onopen = function (event) {
      window.setInterval(function ping() {
        ws.send('Hello, WebSocket!'); // 发送一条消息
        console.log('已发送消息');
      }, 10000);
      console.log('WebSocket连接成功',event);
    };
    // websocket 接收到消息事件
    ws.onmessage = function (e) {
      const messageContent = JSON.parse(e.data);
      console.log('收到消息:', messageContent);
      var msg = JSON.parse(e.data);
      console.log(msg,'消息事件')
    }
    // 关闭
    ws.onclose = function close() {
      console.log('Disconnected');
    };
    // websocket 错误事件
    ws.onerror = function (error) {
      console.error('WebSocket error observed:', error);
    };
  }
  

2.在页面初始化的时候调用getWebSocket此方法

最近更新

  1. docker php8.1+nginx base 镜像 dockerfile 配置

    2024-07-19 20:00:06       67 阅读
  2. Could not load dynamic library ‘cudart64_100.dll‘

    2024-07-19 20:00:06       72 阅读
  3. 在Django里面运行非项目文件

    2024-07-19 20:00:06       58 阅读
  4. Python语言-面向对象

    2024-07-19 20:00:06       69 阅读

热门阅读

  1. 蓝牙新篇章:WebKit的Web Bluetooth API深度解析

    2024-07-19 20:00:06       23 阅读
  2. Solana开发之Anchor框架-部署到 Devnet

    2024-07-19 20:00:06       16 阅读
  3. 快速上手绿联私有云UGOS Pro系统Docker

    2024-07-19 20:00:06       19 阅读
  4. 跟ChatGPT学习go语言--int 类型如何转化成string

    2024-07-19 20:00:06       16 阅读
  5. C语言相关知识点(不定期更新内容)

    2024-07-19 20:00:06       22 阅读
  6. C++如何管理指针从而避免内存泄露

    2024-07-19 20:00:06       16 阅读
  7. OpenCV——图像与视频的保存

    2024-07-19 20:00:06       19 阅读
  8. Vue 给表格单元格加省略号和hover提示

    2024-07-19 20:00:06       18 阅读
  9. Eclipse Temurin Docker镜像

    2024-07-19 20:00:06       16 阅读