Node.js中使用多版本socket.io-client CDN遇连接超时及ws错误求助

问题根源 #

你使用的CDN版socket.io-client是为浏览器环境编译的，强行在Node.js里做环境适配时，ws模块会检测到当前环境被伪装成浏览器（因为你把global赋值给了self），从而抛出环境不兼容的错误。

方案一：直接使用对应版本的npm包（推荐） #

CDN版本本就不是为Node.js环境设计的，官方提供了各版本的npm包，直接安装对应版本即可，无需手动适配环境：

1. 安装指定版本的socket.io-client：

npm install socket.io-client@1.3.7

2. 在代码中正常导入使用：

import io from 'socket.io-client';

const socket = io(url, {
  // 你的配置项
});

socket.on('connect', () => {
  console.log('连接成功');
});

这种方式是官方支持的Node.js用法，不会有环境冲突问题，稳定性更高。

方案二：修改自定义适配代码（仅当必须用CDN版本时） #

如果一定要用CDN的编译代码，需要调整环境判断逻辑，避免让ws模块误以为当前是浏览器环境：

修改你的适配文件代码：

/* eslint-disable */
let ws;
// 仅在Node.js环境导入ws模块
if (typeof process !== 'undefined' && process.versions?.node) {
  ws = require('ws');
}

export default function () {
  // 区分Node.js和浏览器环境
  const isNodeEnv = typeof process !== 'undefined' && process.versions?.node;

  if (isNodeEnv) {
    // Node.js环境下初始化必要的全局对象
    global.self = global;
    if (!global.self.WebSocket) {
      global.self.WebSocket = ws;
    }
    if (!global.self.navigator) {
      global.self.navigator = { userAgent: 'node' };
    }
  } else {
    // 浏览器环境保持原生WebSocket，不做修改
    if (typeof window.navigator === 'undefined' || !window.navigator.userAgent) {
      window.navigator.userAgent = 'browser';
    }
  }

  // 这里粘贴完整的CDN版socket.io.min.js代码
  var t;
  return function e(t, n, r) {
    // ... 原CDN代码内容
  }
}

同时修正导入后的调用方式（确保调用逻辑正确）：

import createIo from './versions/v1_3_7.js';

const io = createIo();
const socket = io(url, {
  // 你的配置项
});

这样调整后，ws模块只会在Node.js环境下被导入和使用，不会触发浏览器环境的错误。

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