当前位置: 首页> 教育> 锐评 > websocket投送

websocket投送

时间:2025/7/11 8:10:33来源:https://blog.csdn.net/Seven_Ting/article/details/140929514 浏览次数:0次

一、websocket投送

a.vue页面实现websocket投送

1、点击页面投送调用websocket的初始化

<template><div class="cssFont" @click="goWebSocket">点击将页面投送</div>
</template>
<script>
export default {methods: {goWebSocket(){this.initWebSocket(); //调用初始化},}
}</script>

2、methods里写好所有的websocket方法

<template><div class="cssFont" @click="goWebSocket">点击将页面投送</div>
</template><script>
export default {mounted() {},beforeDestroy() {this.websocketOnclose();},methods: {goWebSocket(){this.initWebSocket(); //调用初始化},initWebSocket: function () {const that = this;this.loading = true;that.websocketOnclose();let projectType = this.CQfrom.projectType; //项目类型let projectCode = this.CQfrom.projectCode; //项目code//   this.deviceVal 当前对接链接的设备let url = `${process.env.VUE_APP_WS_API}/websocket/${this.deviceVal}/${projectType}/${projectCode}`;this.websock = new WebSocket(url); //新建一个WebSocket的构造函数this.websock.onopen = this.websocketOnopen; //连接成功this.websock.onerror = this.websocketOnerror; //连接失败this.websock.onmessage = this.websocketOnmessage; //消息返回this.websock.onclose = this.websocketOnclose; //关闭websocket},websocketOnopen: function () {console.log("WebSocket连接成功");//开始let val = { val:'需要被投送的显示内容1',val2:'需要被投送的显示内容2'};val["username"] = store.getters.name;let params = {projectCode: val.projectCode,projectType: val.projectType,routeUrl: "/pgd/patientForm/deliveryBook",client: this.deviceVal,paramsJsonStr: JSON.stringify(val),//此处就是我传递需要渲染到签字页面上的数据,filePath: null,fileView: null,};if (this.CQfrom.projectId) {params["projectId"] = this.CQfrom.projectId;}this.loading = true;agreePush(params) //连接成功后调用的函数.then((res) => {this.loading = false;if (res.code === 200) {this.$message({message: `推送成功到设备${this.deviceVal}`,type: "success",});window.localStorage.setItem(`deviceVal`, this.deviceVal);}}).catch((err) => {this.loading = false;});//结束},websocketOnerror: function (e) {console.log("WebSocket连接发生错误");this.initWebSocket(); //连接发生错误重新连接},websocketOnmessage: function (e) {console.log("-----接收消息-------", e);if (JSON.parse(e.data)) {//接受返回的消息,如果接受到已经签字提交完成后,调用关闭websock接口,直接关闭//开始window.sessionStorage.setItem("pdfData", e.data);this.websock.onclose();setTimeout(() => {this.$router.go(-1);}, 100);//结束}console.log("-----接收消息-------", JSON.parse(e.data));},websocketOnclose: function (e) {//关闭websocket的接口if (e) {console.log("connection closed (" + JSON.parse(e.code) + ")");}},},
};
</script><style rel="stylesheet/scss" lang="scss" scoped>
.cssFont {font-size: 16px;color: #363e45;font-weight: 600;padding: 0 60px 0 60px;height: 46px;line-height: 46px;font-family: PingFangSC, PingFang SC;
}
</style>

注意:后面就是等着签字端签完然后将签完的内容投送回来 

关键字:websocket投送

版权声明:

本网仅为发布的内容提供存储空间,不对发表、转载的内容提供任何形式的保证。凡本网注明“来源:XXX网络”的作品,均转载自其它媒体,著作权归作者所有,商业转载请联系作者获得授权,非商业转载请注明出处。

我们尊重并感谢每一位作者,均已注明文章来源和作者。如因作品内容、版权或其它问题,请及时与我们联系,联系邮箱:809451989@qq.com,投稿邮箱:809451989@qq.com

责任编辑: