Nodejs 起一个websocket服务

最近闲来无事想了解一下websocket这方面的知识自己做了一下了解然后在这里做个笔记

首先 WebSocket是一种在单个TCP连接上进行全双工通信的协议,WebSocket使得客户端和服务器之间的数据交换变得更加简单，允许服务端主动向客户端推送数据。在WebSocket API中，浏览器和服务器只需要完成一次握手，两者之间就直接可以创建持久性的连接，并进行双向数据传输。像即时聊天这类就用到了websocket技术。

那么让我们来创建一个例子去创建一个websocket 我这边用到了node的 nodejs-websocket 包,非常方便首先先npm i nodejs-websocket一下然后在app.js里创建


const ws = require("nodejs-websocket");
 var server = ws.createServer(function (conn){
     console.log("new");
     //on事件进行监听客户端
   conn.on("text", function (str) {
      console.log(str);
      var data = JSON.parse(str);
      switch (data.type) {
        case "setname":
         conn.nickName = data.name;
         boardcast(data.name + "加入了房间");
       break;
       case "chat":
         boardcast(data.text+'--'+conn.nickName);
       break;
       default:
       break;
   }
 });

 //退出房间
 conn.on("close", function () {
   boardcast(conn.nickName + "离开了房间");
 });
 // setTimeout(()=>{
 //     //给客户端推送的消息
 //     conn.sendText('1122')
 // },5000)
 //监听错误回调
 conn.on("error", function (err) {
   console.log(err, "err");
 });
}).listen(2333);
//广播 
function boardcast(str) {
  //connections包含了所有的conn 遍历所有conn发送消息
   server.connections.forEach((item) => {
    item.sendText(str);
  });
}

这样服务端的ws就创建好了接下来在客户端去连接一下

在客户端创建ws

     <body>
<input type="text" id="name" class="name" />
<button type="button" id="setname">设置</button>
<input type="text" id="text" />
<button id="btn" type="button">发送</button>
<div id="container" class="container"></div>
<script>
 //创建一个ws链接
 var ws = null;
 document.getElementById("setname").onclick = function () {
   var name = document.getElementById("name").value;
   if (name == "") return alert("名字为空");
   ws = new WebSocket("ws://localhost:2333");
   ws.onopen = function () {
     ws.send(JSON.stringify({ name: name, type: "setname" }));
     document.getElementById("btn").onclick = function () {
       //客户端发送方法
       ws.send(
         JSON.stringify({
           text: document.getElementById("text").value,
           type: "chat",
         })
       );
     };
   };
   ws.onmessage = function (e) {
       var p = document.createElement("p");
       p.innerHTML = e.data;
       document.getElementById('container').appendChild(p);
       //服务端传递的消息
       // console.log(e.data);
     };
     document.getElementById('setname').setAttribute('disabled',true)
 };

</script>

这样一个简单的ws聊天室就完成啦启动一下node app.js 在页面设置一下名字就可以两个页面质检进行聊天啦

简易搭建一个ws的聊天室

Nodejs 起一个websocket服务

最近闲来无事 想了解一下websocket这方面的知识 自己做了一下了解 然后在这里做个笔记

最近闲来无事想了解一下websocket这方面的知识自己做了一下了解然后在这里做个笔记