首页 > 其他分享 >websocket js 客户端自动重新连接

websocket js 客户端自动重新连接

时间:2023-09-25 15:57:58浏览次数:32  
标签:function 定时器 WebSocket log console js ws websocket 客户端

var wsUrl = 'ws://' + (document.domain || '127.0.0.1') + ':8282';

var ws = null; // WebSocket 对象
var heartbeatTimer = null; // 心跳定时器
var isReconnect = true; // 是否自动重连

// 创建 WebSocket 连接
// @auth https://so.csdn.net/so/ai
function createWebSocket() {
    if ("WebSocket" in window) {
        ws = new WebSocket(wsUrl);

        // WebSocket 打开事件
        ws.onopen = function () {
            console.log("WebSocket 已连接");

            // 开始心跳定时器
            startHeartbeat();
        };

        // WebSocket 收到消息事件
        ws.onmessage = function (evt) {
            console.log("WebSocket 收到消息:" + evt.data);
        };

        // 发生错误回调
        ws.onerror = function (e) {
            console.log('WebSocket错误:', e);
        }

        // WebSocket 关闭事件
        ws.onclose = function () {
            console.log("WebSocket 已关闭");

            // 停止心跳定时器
            stopHeartbeat();

            // 断线后自动重连
            if (isReconnect) {
                setTimeout(function () {
                    console.log("WebSocket 尝试重新连接");
                    createWebSocket();
                }, 3 * 1000);
            }
        };
    } else {
        console.log("该浏览器不支持 WebSocket");
    }
}

// 发送消息
function sendMessage(message) {
    if (ws != null && ws.readyState == WebSocket.OPEN) {
        ws.send(message);
        console.log("WebSocket 发送消息:" + message);
    } else {
        console.log("WebSocket 连接没有建立或已关闭");
    }
}

// 开始心跳定时器
function startHeartbeat(interval) {
    interval = interval || 30;
    heartbeatTimer = setInterval(function () {
        sendMessage("heartbeat");
    }, interval * 1000);
}

// 停止心跳定时器
function stopHeartbeat() {
    clearInterval(heartbeatTimer);
}

// 启动 WebSocket 连接
createWebSocket();
 

标签:function,定时器,WebSocket,log,console,js,ws,websocket,客户端
From: https://www.cnblogs.com/chenkg/p/17728088.html

相关文章

  • websocket 多次重新连接
    letsocket=null;letheartbeatTimer=null;letreconnectTimer=null;//定义重连函数functionreconnect(){clearTimeout(reconnectTimer);reconnectTimer=setTimeout(()=>{socket=newWebSocket('ws://url');},3000);}//发送心跳数据......
  • immerjs:React开发必会技能
    immerjs:React开发必会技能龙骑士尹道长 ​关注 2人赞同了该文章我们都知道React追求的泛式是数据不可变,一般情况下state或者props改变才进入render阶段;如果我们创建的state是一个一般数据类型,他就是一个不可变的值,如果需要改变我们需要重新创建一个state......
  • pbjs 无法编码 bytes 类型数据问题的解决方案
    问题背景之前写过一篇《使用脚本收发protobuf协议数据》,通过pbjs命令可以将protobuf二进制数据转换为json:>pbjsmsg.proto--decodeProbeIpv6Response<response.bin{"selfAddr":{"addrV6":"2409:8900:7900:8f0d:ecd9:4aee:aa3:7ad","port......
  • MySQL——处理JSON类型的数据
    MySQL对JSON类型数据的处理参考视频:快速学习MySQL8JSON注意,本文的键名也可以叫key,键值也可以叫value,意思是一样的1.字符串查询:JSON_EXTRACT假设我们有一个表叫做testDemo,其中有一个字段叫做details,类型为JSON,他的数据结构如下,我们就以这个结构为例(这是个例子,假设有很多行......
  • execjs执行js出现window对象未定义时的解决
    参考:https://www.jianshu.com/p/b82def6b3abchttps://blog.csdn.net/xx117501/article/details/102804286......
  • 中国蚁剑为啥没有jsp连接
    大佬们,我是个刚入门的小菜鸟,因为没有开通会员只能用文字说明.最近我研究到了用jsp马的方式文件上传,我想用蚁剑连接,发现我的蚁剑选项里没有jsp类型,只有php、asp、custom,我重新下载了很多次,百度、csdn、b站也搜了很多次,就是没找到解决方案.想问问有没有大佬知道的.......
  • 14.JSON之间的相互转换
    Javascript中任何支持的类型都可以转换为JSON字符串对象{}数组【】所有的键值对key;valuevarasd={name:'猴王',age:123,nl:12234123}//对象转化为JSON字符串varaaa=JSON.stringify(asd);//JSON字符串转化为对象varabc=JSON.parse('{......
  • Redis 客户端连接
     Redis命令用于在redis服务上执行操作。要在redis服务上执行命令需要一个redis客户端。Redis客户端在Redis包中有提供,这个包在我们前面的安装教程中就有安装过了。Redis通过监听一个TCP端口或者Unixsocket的方式来接收来自客户端的连接,当一个连接建立......
  • SpringBoot WebSocket STOMP
    SpringBootWebSocketSTOMP关键词:Springboot,WebSocket,STOMP,broadcast,sendToUser,MessageMapping,SubscribeMapping,convertAndSendToUserSTOMP是一种发布订阅的模式,被订阅者发布消息以广播形式发送。如果需要一对一发送或者说指定某个客户端发送,springboot提供了con......
  • pfSense防火墙客户端访问光猫的配置
    光猫采用桥接模式,通过pfSense防火墙PPPoE拨号上网,客户端将无法访问光猫配置界面。这是因为拨号后,防火墙会将所有出站流量发送到上游ISP,ISP不会将专用子网路由传回光猫,导致无法访问光猫。本文介绍在不增加任何设备的情况下访问光猫的配置方法。解决思路:因为PPPoE拨号分配的是虚拟PP......