SvelteKit跨文件调用Socket.IO发送事件报错：io未定义

你遇到的Cannot read properties of undefined (reading 'emit')错误，核心原因是**io变量未被正确初始化**：你在Vite插件的configureServer中初始化io，但这个逻辑仅在Vite开发服务器启动时执行，而SvelteKit的服务器端action（+page.server.ts）运行在独立的服务器上下文，此时io变量并未被赋值，调用send时自然会报错。

1. 改用SvelteKit Hooks初始化Socket.IO #

创建src/hooks.server.ts，在这里完成Socket.IO的初始化，确保开发/生产环境下服务器启动时都会执行这段逻辑：

import { Server } from 'socket.io';
import type { Handle } from '@sveltejs/kit';

let io: Server;

export const handle: Handle = async ({ event, resolve }) => {
  // 仅初始化一次Socket.IO实例
  if (!io) {
    const server = event.platform?.env?.SERVER;
    if (!server) throw new Error('无法获取HTTP服务器实例');
    
    io = new Server(server, {
      cors: {
        origin: process.env.NODE_ENV === 'development' ? 'http://localhost:5173' : '你的生产域名',
        methods: ['GET', 'POST']
      }
    });

    io.on('connection', (socket) => {
      socket.emit('eventFromServer', 'Hello, World 👋');
    });

    console.log('Socket.IO 服务器已初始化');
  }

  // 将io实例挂载到event.locals，方便后续场景调用
  event.locals.io = io;

  return resolve(event);
};

// 导出获取io实例的方法
export function getIO() {
  return io;
}

2. 更新socketIo.ts文件逻辑 #

移除旧的Vite相关初始化代码，改为从hooks获取实例：

import { getIO } from '$lib/hooks.server'; // 根据你的文件路径调整

export function send(sms: string) {
  const io = getIO();
  if (!io) {
    console.error('Socket.IO 实例未初始化');
    return;
  }
  io.emit('eventFromServer', sms);
}

3. 清理Vite配置 #

删除vite.config.ts中旧的WebSocket插件，避免重复初始化：

import { sveltekit } from '@sveltejs/kit/vite';
import type { UserConfig } from 'vite';

const config: UserConfig = {
  plugins: [sveltekit()]
};

export default config;

4. 在表单Action中调用send函数 #

修改+page.server.ts，确保正确导入并使用：

import { send } from '$lib/socketIo'; // 根据你的文件路径调整

export const actions = {
  default: async ({ request }) => {
    // 可选：处理表单提交数据
    const formData = await request.formData();
    // 发送WebSocket消息
    send('表单提交成功！');
    return { success: true };
  }
};

• 开发环境下SvelteKit服务器重启时，hooks中的初始化逻辑只会执行一次，避免重复创建Socket.IO实例。
• 生产环境部署时，需确保托管平台支持获取HTTP服务器实例（如自托管Node.js、Vercel/Netlify的特定配置）。
• 若需定向给单个客户端发消息，可在connection事件中保存socket.id，后续通过io.to(socketId).emit()实现。

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