如何用Express+Socket.IO构建端点：转发请求至WebSocket客户端并等待响应

Got it, this is a common scenario when you need to bridge Express's request/response cycle with Socket.IO's event-based communication. The key here is to wrap the Socket.IO event handling in a Promise so you can await it within your Express route. We'll also use unique request IDs to avoid mixing up responses from concurrent requests, and add timeouts to prevent hanging requests.

Step 1: Full Server Implementation #

First, here's the complete server.js code with all necessary parts:

const express = require('express');
const http = require('http');
const { Server } = require('socket.io');
const { v4: uuidv4 } = require('uuid'); // For generating unique request IDs

const app = express();
const server = http.createServer(app);
const io = new Server(server, {
  cors: {
    origin: "*", // Restrict this to your client URL in production
    methods: ["GET", "POST"]
  }
});

// Parse JSON request bodies
app.use(express.json());

// The Express endpoint that bridges to Socket.IO
app.post('/endpoint', async (req, res) => {
  try {
    // Generate a unique ID to match the request with its corresponding response
    const requestId = uuidv4();
    const outgoingRequest = {
      id: requestId,
      payload: req.body // Pass the incoming request data to the WebSocket client
    };

    // Create a Promise that resolves when we receive the matching 'res' event
    const waitForSocketResponse = new Promise((resolve, reject) => {
      // Set a timeout to avoid hanging the request indefinitely
      const timeoutId = setTimeout(() => {
        reject(new Error('WebSocket response timed out after 10 seconds'));
        io.off('res', handleResponse); // Clean up the listener to prevent leaks
      }, 10000); // Adjust timeout duration as needed

      // Handler to listen for the 'res' event
      function handleResponse(incomingResponse) {
        // Only process responses that match our request ID
        if (incomingResponse.id === requestId) {
          clearTimeout(timeoutId);
          io.off('res', handleResponse); // Clean up the listener
          resolve(incomingResponse);
        }
      }

      // Attach the listener
      io.on('res', handleResponse);
    });

    // Emit the 'req' event to connected WebSocket clients
    io.emit('req', outgoingRequest);

    // Wait for the WebSocket client to send back the 'res' event
    const socketResponse = await waitForSocketResponse;

    // Send the WebSocket response as the Express endpoint's response
    res.status(200).json(socketResponse);
  } catch (error) {
    // Handle errors (timeout, Socket.IO issues, etc.)
    res.status(500).json({ error: error.message });
  }
});

// Start the server
const PORT = 3000;
server.listen(PORT, () => {
  console.log(`Server running on http://localhost:${PORT}`);
});

Step 2: Client-Side Socket.IO Code #

Your WebSocket client needs to listen for the req event, process the data, and send back a res event with the matching ID. Here's a simple example:

// Client-side code (browser or Node.js)
const socket = io('http://localhost:3000');

socket.on('req', (request) => {
  // Process the request payload here (e.g., run a task, fetch data)
  const processedResult = {
    id: request.id, // Critical: match the original request ID
    status: 'success',
    data: `Processed your request: ${JSON.stringify(request.payload)}`
  };

  // Send the response back to the server
  socket.emit('res', processedResult);
});

Key Details to Note #

• Unique Request IDs: This ensures that even with multiple concurrent requests, each response is mapped to the correct original request. We use the uuid package for this, but you can use any unique string generator.
• Timeout Handling: The 10-second timeout prevents the Express route from hanging indefinitely if the WebSocket client doesn't respond. Adjust this value based on your use case.
• Listener Cleanup: We remove the res event listener after getting the response or hitting the timeout to avoid memory leaks from leftover event handlers.
• CORS Configuration: In production, replace the wildcard * with your actual client URL to secure the Socket.IO connection.

内容的提问来源于stack exchange，提问作者Gijo Varghese