1. vue代码
methods: {
//在方法里调用 this.websocketsend()发送数据给服务器
onConfirm () {
//需要传输的数据
let data = {
code: 1,
item: ‘传输的数据'
}
this.websocketsend(jsON.stringify(data))
},
/*
*/
initWebSocket () { // 初始化weosocket
let userinfo = getUserInfo()
let username = userinfo.waiter_userid
this.websock = new WebSocket('ws://' + baseURL + '/websocket/' + username)
this.websock.onmessage = this.websocketonmessage
this.websock.onerror = this.websocketonerror
this.websock.onopen = this.websocketonopen
this.websock.onclose = this.websocketclose
},
websocketonopen () { // 连接建立之后执行send方法发送数据
let data = {
code: 0,
msg: '这是client:初次连接'
}
this.websocketsend(JSON.stringify(data))
},
websocketonerror () {
console.log( 'WebSocket连接失败')
},
websocketonmessage (e) { // 数据接收
console.log('数据接收' + e.data)
},
websocketsend (Data) { // 数据发送
this.websock.send(Data)
},
websocketclose (e) { // 关闭
console.log('已关闭连接', e)
}
},
www.cppcns.com created () {
console.log('created')
this.initWebSocket()
},
data () {
return {
websocket: null
}
},
destroyed () {
this.websock.close() // 离开路由之后断开websocket连接
}
2. java代码
项目引入tomcat安装目录里的两个依赖包
package diancan.servlet;
import java.io.IOException;
import java.util.Map;
import java.util.concurrent.ConcurrentHashMap;
import javax.websocket.OnClose;
import javax.websocket.OnError;
import javax.websocket.OnMesBzvLMdeoynsage;
import javax.websocket.OnOpen;
import javax.websocket.Session;
import javax.websocket.server.Patwww.cppcns.comhParam;
import javax.websocket.server.Server
在项目别的类可通过new WebSocket()向客户端发送数据
WebSocket ws = new WebSocket();
ws.sendMessageAll(JSON.toJSONString(rs));
以上这篇Vue+Java 通过websocket实现服务器与客户端双向通信操作就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持我们。
本文标题: Vue+Java 通过websocket实现服务器与客户端双向通信操作
本文地址: http://www.cppcns.com/wangluo/javascript/348055.html