I'm experiencing an issue with WebSocket connections in my application deployed on Railway. The WebSocket connections work perfectly in my local development environment but fail in production. Here are the details:

• Error Message: "WebSocket is closed before the connection is established."

• Environment: The application is deployed on Railway at https://pmalch-production.up.railway.app.

• Local Environment: WebSocket connections work without issues using ws://localhost:3001.

Technical Details:

• WebSocket Server and Client: Both are using Socket.IO version ^4.8.1.

• Server Configuration: The server handles both HTTP and WebSocket connections on the same port, dynamically assigned by Railway using the PORT environment variable.

• CORS Configuration: The server allows requests from https://pmalch-production.up.railway.app.

• Environment Variables: NEXT_PUBLIC_SOCKET_SERVER_URL is set to https://pmalch-production.up.railway.app.

Code Snippets:

Server Setup (server.ts):

const config: ServerConfig = {

    port: Number.parseInt(process.env.PORT || "3001", 10),

    host: process.env.HOST || "localhost",

    allowedOrigins: [

process.env.NEXT_PUBLIC_SITE_URL || "http://localhost:3000",

        "https://pmalch-production.up.railway.app",

    ],

};

initializeSocketServer(httpServer, {

    cors: {

        origin: config.allowedOrigins,

        methods: ["GET", "POST"],

        credentials: true,

    },

});

Socket.IO Server Configuration (chat.ts):

this.io = new SocketServer(httpServer, {

    cors: corsOptions,

    pingTimeout: 60000,

    pingInterval: 25000,

    connectTimeout: 60000,

    path: "/socket.io/",

    transports: ["websocket"],

    allowUpgrades: false,

    allowEIO3: true,

});

Client Setup (socket.tsx):

const SOCKET_SERVER_URL =

process.env.NEXT_PUBLIC_SOCKET_SERVER_URL ||

    (typeof window !== "undefined"

        ? ${window.location.protocol}//${window.location.host}

        : "http://localhost:3001");

const socketInstance = io(SOCKET_SERVER_URL, {

    withCredentials: true,

    timeout: 60000,

    reconnection: true,

    reconnectionAttempts: 10,

    reconnectionDelay: 1000,

    reconnectionDelayMax: 10000,

    path: "/socket.io/",

    transports: ["websocket"],

    forceNew: true,

    autoConnect: true,

});

Network Tab:

In the network WebSocket tab, I see the following request:

wss://pmalch-production.up.railway.app/socket.io/?EIO=4&transport=websocket

accept-encoding: gzip, deflate, br, zstd

accept-language: en-US,en;q=0.9,ru;q=0.8

cache-control: no-cache

connection: Upgrade

cookie: NEXT_LOCALE=en; __Secure-better-auth.session_token=TOKEN%3D

host: pmalch-production.up.railway.app

origin: https://pmalch-production.up.railway.app

Any insights or suggestions to resolve this issue would be greatly appreciated.

Thank you for your support!