NodeJs实现websocket

介绍

WebSocket是一种在单个TCP连接上进行全双工通信的协议，在web开发中常用于实现实时通信。Node.js提供了一个内置模块ws来实现WebSocket服务端。

下面是一个简单的例子：

// 导入ws模块
const WebSocket = require('ws');

// 创建WebSocket服务器
const wss = new WebSocket.Server({
    
     port: 8080 });

// 监听连接事件
wss.on('connection', function (ws) {
    
    
  console.log('客户端连接成功');

  // 监听接收消息事件
  ws.on('message', function (message) {
    
    
    console.log('接收到客户端消息：', message);

    // 发送消息到客户端
    ws.send('服务器收到消息：' + message);
  });

  // 监听关闭连接事件
  ws.on('close', function () {
    
    
    console.log('客户端断开连接');
  });
});

我们首先导入ws模块，然后通过WebSocket.Server创建一个WebSocket服务器。接着监听connection事件，当有客户端连接时就会执行回调函数，并创建一个WebSocket实例。然后我们可以监听message事件来接收客户端发送的消息，使用ws.send方法将消息发送给客户端。最后，我们还监听close事件，当客户端断开连接时会执行回调函数。

客户端代码

<!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>
     <script>
         var socket
         if (!window.WebSocket) {
    
    
             window.WebSocket = window.MozWebSocket
         }
         if(window.WebSocket){
    
    
             socket = new WebSocket("ws://localhost:8080/ws")
             socket.onmessage = function(event){
    
    
                 var ta = document.getElementById('responseTest')
                 ta.value = ta.value + '\n' + event.data
             }
             socket.onopen = function(event) {
    
    
                 var ta = document.getElementById('responseTest')
                 ta.value = '连接开启!'
             }
 
             socket.onclose = function(event) {
    
    
                 var ta = document.getElementById('responseTest')
                 ta.value = '连接关闭!'
             }
         }else{
    
    
             alert('你的浏览器不支持WebSocket')
         }
 
         function send(message){
    
    
             if(!window.WebSocket){
    
    
                 return
             }
             if(socket.readyState === WebSocket.OPEN){
    
    
                 socket.send(message)
             }else{
    
    
                 alert('连接没有开启')
             }
         }
     </script>
     <form onsubmit="return false">
         <h3>WebSocket 聊天室：</h3>
         <textarea  id="responseTest" style="width: 500px;height: 300px;"></textarea>
         <br>
         <input type="text" name="message" style="width: 300px;" value="Welcome to woniuxy.com">
         <input type="button" value="发送消息" onclick="send(this.form.message.value)">
         <input type="button" value="清空聊天记录" onclick="javascript:document.getElementById('responseTest').value=''">
     </form>
 </body>
 </html>

介绍

猜你喜欢