VUE+WebSocket实现实时推送

data() {return {id: 1,webSock: null,lockReconnect: false, //避免重复连接}
},
mounted() {// 调取websocket方法 写在mounted方法中this.initWebSocket()
},
methods: {// 发送websockwt请求initWebSocket() {let websocketUrl = 'ws://192.168.3.52:6078/bolt'// WebSocket与普通的请求所用协议有所不同，ws等同于http，wss等同于httpsthis.webSock = new WebSocket(websocketUrl)this.webSock.onopen = this.webSocketOnOpenthis.webSock.onerror = this.webSocketOnErrorthis.webSock.onmessage = this.webSocketOnMessagethis.webSock.onclose = this.webSocketClose},webSocketOnOpen() {console.log('WebSocket连接成功')//  传递参数  不需要传参就不传this.webSocketSend(this.id)},webSocketOnMessage(e) {//接收数据console.log('WebSocket 接受数据')console.log(e)将接收的数据转为json格式var jsonObj = JSON.parse(e.data)console.log(jsonObj)},webSocketClose(e) {console.log('断开连接', e)this.lockReconnect = falsethis.reconnect()},webSocketOnError(e) {console.log('报错信息', e)},webSocketSend(Data) {//发送数据发送this.webSock.send(Data)},// 断开重连操作reconnect() {if (this.lockReconnect) returnthis.lockReconnect = truelet _this = this//没连接上会一直重连，设置延迟避免请求过多setTimeout(function () {_this.initWebSocket()_this.lockReconnect = false// _this.isOne = 1;}, 2000)},
}

VUE+WebSocket实现实时推送相关推荐

springboot集成webSocket实现实时推送
springboot集成webSocket实现实时推送 webSocket实现推送 webSocket是什么? 需求说明 websocket集成步骤 pom.xml webSocket实现自定义处理 ...
Spring clound+VUE+WebSocket实现消息推送一（即时通讯）
需求: 当用户进行某个操作,需要通知其他用户时,其他用户可以实时接收消息. 工程为 Spring cloud + VUE . 技术实现: Spring Cloud.Spring boot.vue.we ...
saltstack event配合websocket客户端实时推送结果
前沿: 以前都是调取一个url的接口,把结果post过去,然后接收post请求的那个函数,会把结果send到指定的websocket客户端,也可以是所有的websocket客户端. 但总是觉得频繁的调 ...
Vue-全局websocket 实现消息推送
在上一篇文章 WebSocket 消息推送https://blog.csdn.net/qq_63312957/article/details/125375122?spm=1001.2014.3001. ...
html站内消息列表,WebSocket实现站内消息实时推送
关于WebSocket WebSocket是HTML5 开始提供的一种在单个TCP连接上进行全双工通讯的协议.什么是全双工?就是在同一时间可以发送和接收消息,实现双向通信,比如打电话.WebSocke ...
websocket实现GPS数据的实时推送与地图的展示(优化)
概述前两天,发布了一片文章websocket实现GPS数据的实时推送与地图的展示,文章发出后引来了不少读者的关注,也有不少读者要求做进步一优化.本文应大家的要求,对上文的内容做一个优化,优化地方包括 ...
物联网设备数据流转之数据如何实时推送至前端：WebSocket前端接收
背景在实现 WebSocket 前端接收前,我们先说明白一件事,为什么要使用WebSocket? 这要从 HTTP 协议说起,我们知道 HTTP 协议只能由客户端发起,而且是短链接,这就会导致我们在 ...
python websocket实现消息推送_Python Websocket消息推送---GoEasy
Goeasy, 它是一款第三方推送服务平台,使用它的API可以轻松搞定实时推送!个人感觉goeasy推送更稳定,推送速度快,代码简单易懂上手快浏览器兼容性:GoEasy推送支持websocket ...
WEB 实时推送技术总结
前言随着 Web 的发展,用户对于 Web 的实时推送要求也越来越高 ,比如,工业运行监控.Web 在线通讯.即时报价系统.在线游戏等,都需要将后台发生的变化主动地.实时地传送到浏览器端,而不需要用 ...

VUE+WebSocket实现实时推送

VUE+WebSocket实现实时推送相关推荐

最新文章

热门文章