Socket.io服务端无法接收客户端信号，请求技术支持

Hey Maxime, let's get that server log working! The problem comes down to two key mismatches in how you're handling Socket.IO events:

1. Mismatched Payload Handling #

Your client is emitting a single object ({from: "Maxime", message: message}), but your server is trying to receive two separate parameters (from, message). Socket.IO passes the entire payload as one argument, so the server can't split it into variables automatically.

Fix the Server Event Listener #

Update your server code to accept the object and destructure its properties:

// Option 1: Destructure directly in the function parameters
io.on('connection', (socket) => {
  socket.on('send message', ({ from, message }) => { 
    console.log('bip!'); 
    console.log(`Message sent from ${from} saying ${message}`); 
  });
});

// Option 2: Destructure inside the function body
io.on('connection', (socket) => {
  socket.on('send message', (data) => { 
    const { from, message } = data;
    console.log('bip!'); 
    console.log(`Message sent from ${from} saying ${message}`); 
  });
});

2. Incorrect Event Listening Scope #

Notice I wrapped the send message listener inside io.on('connection', ...)? That's critical: you need to listen for client-specific events on individual socket instances, not directly on the main io server. The io instance handles server-wide events like new connections, while each socket represents a connected client and listens for events from that client.

Full Working Server Setup Reference #

Make sure your Socket.IO is properly attached to your Express server too—here's a complete example:

const express = require('express');
const http = require('http');
const { Server } = require('socket.io');

const app = express();
const server = http.createServer(app);
const io = new Server(server); // Initialize Socket.IO with the HTTP server

io.on('connection', (socket) => {
  console.log('A client connected!');
  
  // Listen for 'send message' from this client
  socket.on('send message', ({ from, message }) => {
    console.log('bip!');
    console.log(`Message sent from ${from} saying ${message}`);
    
    // Optional: Broadcast the message to all other clients
    socket.broadcast.emit('new message', { from, message });
  });

  socket.on('disconnect', () => {
    console.log('Client disconnected');
  });
});

server.listen(3000, () => {
  console.log('Server running on http://localhost:3000');
});

Once you make these changes, your server should log messages as expected when you click the "send" button on the client!

内容的提问来源于stack exchange，提问作者Maxime Chevallier