websocket在不同的电脑上会出现不同的问题，即在有的电脑上不获取错误刷新之后不会报错，而在有的电脑上不获取错误则会报错,因此倘若在输出来，且能够正常添加数据之后，如若出现刷新出现错误，则需要在页面的最下方获取错误
即在dom页面中写入以下：
ws.addEventListener("error", () => {
console.log("异常");
});
以及后端页面：ws.createServer里面再次获取一次错误
即：
conn.on("error", () => {
console.log("异常");
})
因此页面中完整的代码是
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
</head>
<body>
<input type="text" value="" placeholder="请输入聊天内容" autocomplete="off" />
<button>提交</button>
<div id="messageBox"></div>
<script>
const ws = new WebSocket("ws://127.0.0.1:3000");
const btn = document.querySelector("button");
const messageBox = document.querySelector("#messageBox");
const inputValue = document.querySelector("input");
btn.addEventListener("click", () => {
ws.send(inputValue.value);
});
ws.addEventListener("open", () => {
console.log("我连接成功了");
});
ws.addEventListener("message", (e) => {
console.log(e.data);
var dv = document.createElement("div");
dv.innerText = e.data;
messageBox.append(dv);
});
ws.addEventListener("error", () => {
console.log("异常");
});
</script>
</body>
</html>
后端页面中完整的代码是
const ws = require('nodejs-websocket');
const port = 3000
const server = ws.createServer((conn) => {
console.log("有人连接这个服务了");
conn.on("text", result => {
console.log(result);
conn.send(result)
})
conn.on("error", () => {
console.log("异常");
})
})
server.listen(port, () => {
console.log("websocket服务已启动,正在监听" + port);
})
