Js WebSocket类,收发Json,带心跳,断线重连

如题
心跳:4秒发一次
断线:2秒后自动重连
收发:发送和返回json,处理粘包断包等情况,json字符串最大长度9999
缓存:未连接时,自动缓存100个包,当连接时会自动发出

JS代码

var MyWebSocket = {ws : null,isConnected : false,strLast : "",isDebug : true,url : "",//msreconnectTimeout : 2000,sendBuffMaxSize : 100,arrSendBuff : [],timer : 0,connect : function(url){this.url = url;var that = this;if( this.ws != null ){this.ws.onopen = null;this.ws.onmessage = null;this.ws.onclose = null;this.ws.onerror = null;}if( this.timer==0 ){timer = setInterval( this.heart, 4000, this );}this.ws = new WebSocket(url);this.ws.onopen = function(){that.isConnected = true;//当WebSocket创建成功时,触发onopen事件that.log("open");that.ws.send("0002{}"); //将消息发送到服务端that.sendBuffJson();}this.ws.onmessage = function(e){that.log(e.data);that.strLast += e.data;var strlen = that.strLast.length;if( strlen > 4 ){var len = parseInt( "0x" + that.strLast.substr(0, 4));if( len+4 <= strlen ){var s = that.strLast.substr(4, len+4);that.strLast = that.strLast.substr(len+4);that.log("msg come");that.log(s);if( that.onMsgCome != null ){this.onMsgCome(JSON.parse(s));}}}}this.ws.onclose = function(e){//当客户端收到服务端发送的关闭连接请求时,触发onclose事件that.log("close");that.isConnected = false;that.reconnect();}this.ws.onerror = function(e){//如果出现连接、处理、接收、发送数据失败的时候触发onerror事件that.log(error);}},reconnect : function(){if( this.reconnectTimeout > 0 ){setTimeout(this.doReconnect, this.reconnectTimeout, this);}else this.doReconnect(this);},doReconnect : function(that){that.connect(that.url);},sendBuffJson : function(){var len = this.arrSendBuff.length;for( var i=0; i<len; i++ ){var json = this.arrSendBuff[i];this.send(json);}return len;},heart : function(that){if( !that.isConnected ) return;that.timerNum++;if( that.timerNum > that.sendNum ){that.log("heart");that.ws.send("0000");}},timerNum : 1,sendNum : 1,send : function(json){if( !this.isConnected ){if( this.arrSendBuff.length < this.sendBuffMaxSize ){this.arrSendBuff.push(json);}return;}this.sendNum = this.timerNum + 1;var s = JSON.stringify(json);var prev = "0000" + s.length.toString(16);prev = prev.substr(prev.length-4);s = prev + s;this.ws.send(s);},log : function(s){if( this.isDebug ) console.log(s);},//信息回调回调函数onMsgCome : null,
}

测试代码

<!DOCTYPE html>
<html>
<head><meta charset=utf-8 /><title>MyWebSocket</title>
</head>
<script type="text/javascript"> </script>
<body><script src="MyWebSocket.js"></script><script>var mw = Object.create(MyWebSocket);mw.connect("ws://127.0.0.1:8888");mw.onMsgCome = function(json){console.log(json);}setInterval(xx, 3000);function xx(){var json = {};json.url = "xx";json.data = {};mw.send(json);}</script></body></html>

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/224815.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

k8s节点not ready

开发小伙伴反应&#xff0c;发布应用失败。检查后发现有个虚拟机挂掉了 启动后先重启服务&#xff1a;&#xff08;一般是自启动&#xff0c;自动拉起pod服务&#xff09; service docker restart docker ps |grep kube-apiserver|grep -v pause|awk ‘{print $1}’|xargs -i …

计算机杂谈系列精讲100篇-【计算机应用】嵌入式系统的软件架构

目录 前言 嵌入式视觉系统 决定架构的因素和架构的影响 2.1. 常见的误解

Appium 图像识别技术 OpenCV

在我们做App自动化测试的时候&#xff0c;会发现很多场景下元素没有id、content-desc、text等等属性&#xff0c;并且有可能也会碰到由于开发采用的是自定义View&#xff0c;View中的元素也无法识别到&#xff0c;很多的自动化测试框架对此类场景束手无策。Appium在V1.9.0中有给…

10个国内外素材网站,提供免费 Photoshop 素材下载资源

即时设计 被很多人视为免费的PS素材网站——即时设计提供了资源广场版块&#xff0c;方便用户查找材料。对于提供的PS材料&#xff0c;即时设计也做了详细的分类工作&#xff0c;用户可以根据不同的使用标签快速找到相应的PS材料。 进入资源广场&#xff0c;在搜索框中输入要…

Golang在 Docker 中交叉编译 Windows

前言&#xff1a; 前端时间把本地的 Golang 开发环境卸载了&#xff0c;如果编写代码的话就是启动一个 Golang 的 Docker 容器。这样做对于服务端开发本来也是没有问题的&#xff0c;但是有时候想要把程序放到 Windows 上面来执行&#xff0c;那就遇到麻烦了。因为 Docker 容器…

华为数通——网络参考模型

OSI参考模型 七层 应用层&#xff1a;最靠近用户的一层&#xff0c;为应用程序提供网络服务。 六层 表示层&#xff1a;数据格式转换编码格式UTF-8。 五层 会话层&#xff1a;双方之间建立、管理和终止会话。 四层 传输层&#xff1a;建立、维护和取消端到端的数据传输过…

verilog语法进阶-分布式ram

概述: FPGA的LUT查找表是用RAM设计的&#xff0c;所以LUT可以当成ram来使用&#xff0c;也并不是所有的LUT都可以当成ram来使用&#xff0c;sliceM的ram可以当成分布式ram来使用&#xff0c;而sliceL的ram只能当成rom来使用&#xff0c;也就是只能读&#xff0c;不能写&#x…

如何使用ArcGIS Pro裁剪影像

对影像进行裁剪是一项比较常规的操作&#xff0c;因为到手的影像可能是多种范围&#xff0c;需要根据自己需求进行裁剪&#xff0c;这里为大家介绍一下ArcGIS Pro中裁剪的方法&#xff0c;希望能对你有所帮助。 数据来源 本教程所使用的数据是从水经微图中下载的影像和行政区…

Nginx-nginx 负载均衡方式(超详细)

负载均衡是一种通过在多个服务器之间分配工作负载来提高系统性能和可用性的技术。它确保所有服务器都能充分利用并且没有过载&#xff0c;从而提供更好的性能、可扩展性和容错性。在Web应用程序中&#xff0c;负载均衡通常用于分发用户请求到多个服务器&#xff0c;以避免单个服…

软件测试用例经典方法 | 单元测试法案例

单元测试又称模块测试&#xff0c;是对软件设计的最小单元的功能、性能、接口和设计约束等的正确性进行检验&#xff0c;检查程序在语法、格式和逻辑上的错误&#xff0c;并验证程序是否符合规范&#xff0c;以发现单元内部可能存在的各种缺陷。 单元测试的对象是软件设计的最…

hive的分区表和分桶表详解

分区表 Hive中的分区就是把一张大表的数据按照业务需要分散的存储到多个目录&#xff0c;每个目录就称为该表的一个分区。在查询时通过where子句中的表达式选择查询所需要的分区&#xff0c;这样的查询效率会提高很多。 静态分区表基本语法 创建分区表 create table dept_p…

HBase的安装与简单操作

文章目录 第1关&#xff1a;Hbase数据库的安装第2关&#xff1a;创建表第3关&#xff1a;添加数据、删除数据、删除表 第1关&#xff1a;Hbase数据库的安装 编程要求 根据上述步骤安装配置好HBase数据库&#xff0c;并启动成功。 测试说明 若安装配置成功&#xff0c;则程序会…

mfc配置halcon环境

新建mfc窗体 选择基于对话框 打开项目属性 1、附加包含目录添加&#xff1a; $(HALCONROOT)\include;$(HALCONROOT)\include\halconcpp 2、链接器->常规->附加库目录 $(HALCONROOT)\lib\x64-win64 3、链接器->输入->附加依赖项 halcon.lib;halconcpp.lib 在对话…

如何在PHP中处理日期和时间?

在 PHP 中&#xff0c;你可以使用内置的 DateTime 类和相关函数来处理日期和时间。以下是一些常见的日期和时间操作的示例&#xff1a; 使用 DateTime 类&#xff1a; 获取当前日期和时间&#xff1a; $currentDateTime new DateTime(); echo $currentDateTime->format(Y-…

sudo apt-get安装的包和pip install以及conda install安装的包的区别

sudo apt-get、pip install 和 conda install 是用于在 Linux 系统中安装软件包的不同方式&#xff0c;它们的区别如下&#xff1a; sudo apt-get&#xff1a; sudo apt-get 是在基于 Debian 的 Linux 发行版&#xff08;如 Ubuntu、Debian&#xff09;中用于管理软件包的命令…

cfa一级考生复习经验分享系列(五)

先说一下背景吧&#xff0c;在职备考&#xff0c;工作领域和金融相关&#xff0c;本身也是金融专业毕业&#xff0c;说来惭愧&#xff0c;工作2年才报名参加CFA考试。工作后再参加考试会有一点心态上的转变&#xff0c;毕竟没有那么多时间去浪费了&#xff0c;所以每次考试会尽…

网络入门---守护进程

目录标题 什么是守护进程会话的理解setsid函数daemonSelf函数模拟实现测试 什么是守护进程 在前面的学习过程中我们知道了如何使用TCP协议和UDP协议来实现通信&#xff0c;比如说登录xshell运行了服务端&#xff1a; 然后再登录一个xshell运行客户端并向服务端发送信息&#…

基于若依搭建微服务nacos版本(ruoyi-Cloud前后端分离)

说明&#xff1a;本文介绍基于Ruoyi-Cloud前后端分离nacos版本的微服务从0到1的搭建过程&#xff0c;同时新增一个新的微服务模块。是基于官方文档的补充说明&#xff0c;需要结合Ruoyi-Cloud的官方文档 https://doc.ruoyi.vip/ruoyi-cloud/ 如果直接查看官方文档便可成功部署&…

Linux--权限问题(2)

目录 前文 前言 1. 文件的权限 1.1 文件的访问者分类 1.2 文件类型和访问权限&#xff08;事物属性&#xff09; 2. 如何修改文件的权限 3.对比权限有无的表现 4.修改用户角色 5.修改权限的第二种做法 6.目录的权限 7.默认权限 前文 Linux--权限问题&#xff08;1&#…

云原生之深入解析Kubernetes本地持久化存储方案OpenEBS LocalPV的最佳实践

一、K8s 本地存储 K8s 支持多达 20 种类型的持久化存储&#xff0c;如常见的 CephFS 、Glusterfs 等&#xff0c;不过这些大都是分布式存储&#xff0c;随着社区的发展&#xff0c;越来越多的用户期望将 K8s 集群中工作节点上挂载的数据盘利用起来&#xff0c;于是就有了 loca…