连接socket.io服务器出现connect_error due to xhr poll error报错如何解决

AI 小北

2026-9-29

Socket.IO xhr poll error 报错解决方案

核心问题排查

第一个明显错误：客户端连接地址拼写错误
你代码中连接地址写为ws://loacalhost:5000，localhost拼写错误，直接会导致连接失败触发轮询报错。
版本兼容性问题
Socket.IO 客户端与服务端大版本必须匹配，若服务端使用socket.io@4.x，客户端必须使用socket.io-client@4.x，版本不匹配会导致握手失败，触发xhr轮询报错。
传输协议适配问题
Socket.IO默认会先走HTTP长轮询，再尝试升级为WebSocket连接，你可以直接配置强制走WebSocket协议，跳过轮询阶段，规避poll类报错。
CORS配置校验
确认你的React应用启动端口确实为3000，若端口有改动，服务端CORS的origin配置需要同步修改，测试阶段可临时设置为*验证是否为跨域问题。

修正后代码

客户端代码

import io from 'socket.io-client';

// 修正地址拼写，添加transports配置强制走WebSocket
const socket = io("http://localhost:5000", {
  transports: ["websocket"]
});

socket.on("connect_error", (err) => {
  console.log(`connect_error due to ${err.message}`);
});

socket.on("connect", () => {
  console.log("连接成功，socket ID：", socket.id);
});

服务端代码（可选优化CORS配置）

const express = require('express');
const app = express();
const http = require('http');
const server = http.createServer(app);

const io = require("socket.io")(server, {
  cors: {
    origin: "http://localhost:3000", // 与实际前端地址保持一致，测试可临时改为*
    methods: ["GET", "POST"]
  }
})

io.on("connection", (socket) => {
  console.log("新客户端接入，ID：", socket.id)
})

server.listen(5000, () => {
  console.log('Server is listening on Port 5000');
});