How to Properly Configure Nginx Reverse Proxy for WebSockets Deployment?

Question

I'm deploying a C# backend application on Firebase. During development, I used HTTP without any issues. However, after deploying to Firebase, I encountered an error because Firebase enforces HTTPS. To address this, I set up a reverse proxy on my server using Nginx to redirect HTTPS traffic to HTTP on my backend. This solution worked since enabling HTTPS directly on my backend didn't function as expected.

Now, I'm encountering a similar issue with WebSockets, as Firebase requires WSS (WebSocket Secure). I attempted to resolve this by configuring Nginx to redirect WSS traffic to WS (WebSocket over HTTP) in a similar manner to the HTTPS setup. Unfortunately, this isn't working.

Here is my Nginx configuration for handling the WebSocket proxy:

server {
 listen 443 ssl;
 server_name blipsports-backend.zapto.org;

 ssl_certificate /etc/letsencrypt/live/blipsports-backend.zapto.org/fullchain.pem;
 ssl_certificate_key /etc/letsencrypt/live/blipsports-backend.zapto.org/privkey.pem;

 location / {
     proxy_pass http://localhost:5000;
     proxy_set_header Host $host;
     proxy_set_header X-Real-IP $remote_addr;
     proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
     proxy_set_header X-Forwarded-Proto $scheme;
 }

 # Maneja conexiones WebSocket seguras (WSS) y redirige a WS en el backend
 location /ws {
     proxy_pass http://localhost:5000/ws/;
     proxy_http_version 1.1;
     proxy_set_header Upgrade $http_upgrade;
     proxy_set_header Connection "Upgrade";
     proxy_set_header Host $host;
     proxy_set_header X-Real-IP $remote_addr;
     proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
     proxy_set_header X-Forwarded-Proto $scheme;
 }
}

# Redirige todo el tráfico HTTP a HTTPS
server {
 listen 80;
 server_name blipsports-backend.zapto.org;
 return 301 https://$host$request_uri;
}

My websocket in my backend looks like this:

app.Use(async (context, next) =>
{
    if (context.Request.Path == "/ws")
    {
        if (context.WebSockets.IsWebSocketRequest)
        {
            using var webSocket = await context.WebSockets.AcceptWebSocketAsync();
            var webSocketManager = context.RequestServices.GetRequiredService<MultipleWebSocketMana>
            var reservationService = context.RequestServices.GetRequiredService<IReservationService>

            string reservationCode = context.Request.Query["reservationCode"]!;

            if (string.IsNullOrEmpty(reservationCode))
            {
                context.Response.StatusCode = 400; // C�digo de reserva inv�lido
                return;
            }

            webSocketManager.AddSocket(webSocket, reservationCode);

            try
            {
                await HandleWebSocketConnection(webSocket);
            }
            finally
            {
                webSocketManager.RemoveSocket(webSocket, reservationCode); // Asegurarse de remover el socket al cerrar la conexi�n
            }
        }
        else
        {
            context.Response.StatusCode = 400;
        }
    }
    else
    {
        await next();
    }
});