Firefox CORS error during Socket.IO reconnection while Chrome works fine

[Vanals]

Description I'm experiencing CORS issues specifically during Socket.IO reconnection attempts in Firefox, while Chrome works fine. The initial connection works in both browsers, but Firefox fails to reconnect with:

Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at http://localhost:1337/socket.io/?EIO=4&transport=polling&t=htb75obx. (Reason: CORS request did not succeed). Status code: (null).

Setup Client (localhost:3000)

// SocketContextComponent.tsx
const socket = useSocket('ws://localhost:1337', {
    reconnectionAttempts: 10,
    reconnectionDelay: 1000,
    reconnectionDelayMax: 5000,
    autoConnect: false,
    randomizationFactor: 0.5
});

Server (localhost:1337)

// socket.ts
const socketOptions = {
    serveClient: false,
    pingInterval: 10000,
    pingTimeout: 5000,
    cookie: false,
    cors: {
        origin: '*',
        methods: ["GET", "POST", "OPTIONS"],
        allowedHeaders: ["my-custom-header", "Content-Type"],
        credentials: true,
        preflightContinue: false,
        optionsSuccessStatus: 204
    },
    connectionStateRecovery: {
        maxDisconnectionDuration: DISCONNECT_TIMEOUT_MS,
        skipMiddlewares: true,
    }
};

// server.ts (Express server code snipet)
application.use((req, res, next) => {
    res.header('Access-Control-Allow-Origin', '*');
    res.header('Access-Control-Allow-Headers', 'Origin, X-Requested-With, Content-Type, Accept, Authorization');
    
    if (req.method == 'OPTIONS') {
        res.header('Access-Control-Allow-Methods', 'PUT, POST, PATCH, DELETE, GET');
        return res.status(200).json({});
    }
    next();
});

Versions

// Client
"socket.io-client": "^4.7.4"
"next": "14.1.0"

// Server
"socket.io": "^4.7.4"
"express": "^4.18.2"

Behavior Initial connection works in both browsers When disconnecting: Chrome reconnects successfully Firefox fails with CORS error The error only occurs during reconnection attempts Questions Is there a known issue with Firefox handling Socket.IO reconnections differently? Are there Firefox-specific CORS settings I should consider? Could the ws:// protocol in the client (vs http://) be causing issues?

Any insights would be greatly appreciated! Let me know if I can provide any more specific logs?

I checked the documentation https://socket.io/docs/v4/handling-cors/ here but did not manage to solve it my self.

[spyshower]

@Vanals did you figure it out?

[darrachequesne]

Hi! That's really weird. If it connects successfully on the first attempt, then that means that the CORS setup is valid.

Could you please provide the network logs? Are you able to reproduce it consistently?

[Vanals]

@spyshower unfortunately not. Are you having the same issue?

@darrachequesne It consistently happens in my App! I will share more as I get back at it!