实时通信Socket.io的使用
2023-09-27 14:27:34 时间
最近在工作中,遇到了一个需求,需要和后台服务实时通信,获取各种设备的实时状态、以及对设备下发指令。后端这边选择了socket.io这个库,前端这边配合也只能使用这个,它的使用方式跟websocket很类似,为此简单记录一下socket.io的使用,希望帮助到有需要的人。
1、什么是socket.io
Socket.IO 是一个库,可以在客户端和服务器之间实现 低延迟, 双向 和 基于事件的 通信。
它建立在 WebSocket 协议之上,并提供额外的保证,例如回退到 HTTP 长轮询或自动重新连接。
2、socket.io的使用
1、安装引入
npm install socket.io-client
import { io } from "socket.io-client";
复制代码
2、初始化
const socket = io("https://server-domain.com");
3、使用
socket链接成功以后,我们继续接下来的操作,了解各个事件的使用。
socket.on("connect", () => {
//监听连接是否成功
console.log("链接成功");
});
socket.on("disconnect", (reason) => {
//监听连接异常中断
console.log("中断", reason);
});
socket.on("message_event", (data) => {
console.log("接收到的消息", data);
})
// 此处需要注意的是on是一个监听事件,监听的message_event是和后台约定好的事件名。
前端主动断开链接
socket.close()或者 socket.disconnect()
复制代码
4、消息的发送
// 发送消息
sendMessage(msgType, msgContent) {
var jsonObject = { msgType: msgType, msgContent: msgContent };
socket.emit("send_event", jsonObject);
},
//前端这边通过emit发送消息,这里的send_event也是跟后端人员约定好的事件。
复制代码
3、客户端自带事件
除了上面介绍的几个主要事件外、还有一些其他事件
- connect:连接成功
- connecting:正在连接
- disconnect:断开连接
- connect_failed:连接失败
- error:错误发生,并且无法被其他事件类型所处理
- reconnect_failed:重连失败
- reconnect:成功重连
- reconnecting:正在重连
4、版本问题
socket.io分为客户端和服务器端,在选择使用的时候,一定要注意相关版本的选择要对应,要不然就会出现各种奇怪的问题,我当时做的时候没注意这一块,就耽误了一些时间。。。
相关版本兼容性如下表所示!
至此结束,如果此文对你有帮助,请留下你的点赞和评论吧~~
相关文章
- 关闭VS的实时调试器
- jquery中实时监控文本框的变化
- 声网Agora.io全球发布手游实时语音AMG Voice
- 【转】SignalR与ActiveMQ结合构建实时通信
- 基于python的websocket开发,tomcat日志web页面实时打印监控案例
- Springmvc中配置Quartz使用,实现任务实时调度。
- 【Hadoop】Apache Eagle 简介--分布式实时 Hadoop 数据安全方案
- 使用Python,dlib进行对象实时追踪
- Flink大数据实时计算系列-Flink的state backend使用
- Flink大数据实时计算系列-Flink的slot共享
- 一文图解前端WebSocket 实时通信
- 大数据繁荣生态圈组件之实时大数据Druid小传(三)Druid入门实操
- Android 使用socket.io 实现实时通信
- [Big Data - ELK] ELK(ElasticSearch, Logstash, Kibana)搭建实时日志分析平台
- Flume整合Kafka(基于kerberos认证)——完成实时数据采集