迫于需求，需要在jsp里面添加websocket 0202年了呀，哥哥姐姐，这个框架岁数比我的年纪都要大，做惯前后端分离去做jsp是真的恶心，还好只是负责这一轮的更新迭代
呐呐，如果是阁下的话，一定能够好好守护好二次元世界吧，果然吗，即时是我这样的怪胎。咯呐撒嘛也不不会放弃吗，啊你嘎多！
先上效果图
效果图
心跳重连
心跳重连
功能实现
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
<br>
<input type="text" id="sendtext"><button id="btn">发送</button>
<script>
var time
const ws = {
init: () => {
return new WebSocket("ws://localhost:8080/ws")
},
open: socket => {
return new Promise((resolve, reject) => {
socket.onopen = () => {
resolve(200)
}
})
},
send: (socket, value) => {
socket.send(value)
},
// 掉线可以和关闭共用代码
error: socket => {
socket.onerror = () => {
}
},
// 关闭
close: socket => {
socket.onclose = () => {
clearInterval(time)
time = setInterval(() => {
goSocket()
}, 2000)
}
}
}
async function goSocket () {
// 初始化
const socket = ws.init()
// 链接
await ws.open(socket)
// 接收
socket.onmessage = (msg) => {
console.log(msg.data)
}
// 发送
document.getElementById('btn').onclick = () => {
const value = document.getElementById('sendtext').value
ws.send(socket, value)
}
// 监听掉线
ws.error(socket)
// 监听掉线
ws.close(socket)
// 所谓的心跳包
clearInterval(time)
time = setInterval(() => {
ws.send(socket, 'ing')
}, 3000)
}
goSocket()
</script>
</body>
</html>
网友评论