Vue+Java 通过通过websocket实现服务器与客户端双向通信操作实现服务器与客户端双向通信操作
主要介绍了Vue+Java 通过websocket实现服务器与客户端双向通信操作，具有很好的参考价值，希望对大家有
所帮助。一起跟随小编过来看看吧
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)
}
},
created () {
console.log('created')
this.initWebSocket()
},
data () {
return {
websocket: null
}
},
destroyed () {
this.websock.close() // 离开路由之后断开websocket连接
}
2. java代码代码
项目引入tomcat安装目录里的两个依赖包
评论1