原生nodejs结合Socket.io 实现服务器和客户端的相互通信。

怼烎@ 2023-06-04 06:54 9阅读 0赞

### 效果展示： ###

### （1）群发 ###

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L01pc3NfbGlhbmdybQ_size_16_color_FFFFFF_t_70][]

### **（2）谁发就给谁回复 ** ###

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L01pc3NfbGlhbmdybQ_size_16_color_FFFFFF_t_70 1][]

### 代码展示： ###

app.js

app.html

<!DOCTYPE html>
    <html>
      <head>
        <meta charset="utf-8">
        <title>1111</title>
        <script src="/socket.io/socket.io.js"></script>
        <script>
          // 和服务器建立连接
          var socket = io('http://localhost');
    
          window.onload = function() {
            var btn = document.getElementById('btn');
            btn.onclick = function() {
              // [客户端] 给服务器发送数据
              socket.emit('addCart', {
                client: '我是客户端的数据'
              })
            }
    
            // 监听服务器的广播
            socket.on('to-client', function(data) {
              console.log(data);
            })
          }
        </script>
      </head>
      <body>
        客户端
        <button id="btn">给服务器发送数据</button>
    
      </body>
    </html>

代码运行下载详见：[https://download.csdn.net/download/miss\_liangrm/11834257][https_download.csdn.net_download_miss_liangrm_11834257]。

（1）安装Socket.io     [SocketIO官网][SocketIO]

> npm install socket.io

（2）建立连接：

// 引入socket.io
    var io = require('socket.io')(app)
    
    io.on('connection',function(socket){
      console.log('服务器连接成功')
    })

（3） 在客户端html里面引入js   [http://localhost:8888/socket.io/socket.io.js][http_localhost_8888_socket.io_socket.io.js]

[服务器]   给客户端发送数据
        socket.emit();   // 谁给我发的，我发给谁  
        io.emit();   // 群发 ， 给所有连接服务器的客户都广播数据

\----完。

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L01pc3NfbGlhbmdybQ_size_16_color_FFFFFF_t_70]: /images/20230601/809c2e9795ea412eb1b980554288ec14.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L01pc3NfbGlhbmdybQ_size_16_color_FFFFFF_t_70 1]: /images/20230601/da3d6f9fc491491d810a029d98757ef5.png
[https_download.csdn.net_download_miss_liangrm_11834257]: https://download.csdn.net/download/miss_liangrm/11834257
[SocketIO]: https://socket.io/
[http_localhost_8888_socket.io_socket.io.js]: http://localhost:8888/socket.io/socket.io.js