Socket.IO + Angular + Node.js项目TypeScript转换后Socket连接事件不触发问题咨询

我之前也碰到过一模一样的问题，折腾了好一会儿才找到根源——这其实是ES模块（TypeScript）和CommonJS模块下Socket.IO导出结构的差异导致的。

问题根源 #

在CommonJS里，require('socket.io')返回的是一个工厂函数，同时这个函数上还挂载了Server类等属性，所以不管是用require('socket.io')(server, options)这种函数调用方式，还是new require('socket.io').Server(server, options)的类实例化方式，都能正常工作。

但在ES模块（也就是你的TypeScript代码）里，Socket.IO的导出逻辑不一样：

• 默认导出是那个工厂函数
• Server类是单独的命名导出

你代码里写的new socketio.Server(server, ...)，这里的socketio是默认导出的工厂函数，它根本没有Server这个属性——等于你创建了一个无效的Socket.IO实例，自然不会触发connection事件。

两种修复方案 #

方案一：使用命名导出的Server类（推荐，更贴合TypeScript类型系统）

修改你的导入和实例化代码：

// 只导入命名导出的Server类，避免混淆
import { Server } from 'socket.io';

// 直接用Server类创建实例
const io = new Server(server, {
  cors: {
    origin: 'http://localhost:4200', // 注意新版Socket.IO用origin，不是旧版的origins
  },
});

方案二：使用默认导出的工厂函数（和CommonJS写法更接近）

如果习惯了CommonJS的写法，也可以直接调用默认导出的工厂函数：

// 导入默认导出的工厂函数，命名为socketIo（避免和Server类混淆）
import socketIo from 'socket.io';

// 调用函数创建实例
const io = socketIo(server, {
  cors: {
    origin: 'http://localhost:4200',
  },
});

额外验证点 #

1. 版本一致性：确保客户端和服务器的Socket.IO版本完全匹配（v3+和v2版本不兼容，会导致连接失败）
2. CORS配置正确性：新版Socket.IO使用origin字段（支持字符串或数组），旧版用origins，如果你用的是v3+版本，一定要用origin
3. 客户端连接地址：确认客户端是用io('http://localhost:你的服务器端口')连接，不要带错误的路径或端口

修改后重启服务器，再连接客户端，应该就能看到33333的日志输出了！

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