NGINX-WSS connection failing but WS connection works

Question

I am having trouble implementing wss connections in my app over port 443. When connecting to my app over port 80 I able to connect to the socket(ws connection). my app works fine with HTTPS requests(can log in and request data) but cannot handle wss properly. The console logs failed to connect, with no server error codes.

nginx file server 80:

 server {
        listen 80;
        server_name test.com; 
        root   html\test.com;
        index  index.html index.htm;
        
        
        
        location /api/ {
                proxy_pass http://xxx.xxx.xxx.xx:xxxx;
                proxy_http_version 1.1;
                proxy_set_header Upgrade $http_upgrade;
                proxy_set_header Connection 'upgrade';
                proxy_set_header Host $host;
                proxy_cache_bypass $http_upgrade;
                
                
        }
        
        
            
        location /widget/{
            
            proxy_pass http://xxx.xxx.xxx.xx:xxxx/widget/;
            
            proxy_http_version 1.1;
            proxy_set_header Upgrade $http_upgrade;
            proxy_set_header Connection "upgrade";


            proxy_redirect off;
            proxy_set_header Host $host;
            proxy_set_header X $remote_addr;
            proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
            proxy_set_header X-Forwarded-Host $server_name;
            
        }
}

The above code works fine

nginx file server 443:

server {
        listen 443 ssl;
        server_name test.com; 
        root   html\test.com;
        index  index.html index.htm;
        ssl_certificate C:/Certbot/live/test.com/fullchain.pem;
        ssl_certificate_key C:/Certbot/live/test.com/privkey.pem;
        
        
        location /api/ {
                proxy_pass http://xxx.xxx.xxx.xx:xxxx;
                proxy_http_version 1.1;
                proxy_set_header Upgrade $http_upgrade;
                proxy_set_header Connection 'upgrade';
                proxy_set_header Host $host;
                proxy_cache_bypass $http_upgrade;
                
                
        }
        
        
            
            
        location /widget/{
            
            proxy_pass http://xxx.xxx.xxx.xx:xxxx/widget/;
            proxy_http_version 1.1;
            proxy_set_header Upgrade $http_upgrade;
            proxy_set_header Connection "upgrade";
            proxy_redirect off;
            proxy_set_header Host $host;
            proxy_set_header X $remote_addr;
            proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
            proxy_set_header X-Forwarded-Host $server_name;
            
        }
}

I am able to make https requests but I cannot connect to my socket.

My client side code.

let subject = webSocket((window.location.protocol == 'https:' ? 'wss://' : 'ws://') + "xx.xx.xx.xx/widget/" 
    console.log('Server socket' + subject)
    subject.subscribe(data => {console.log(data)});

For my server I am using Django, Django-Channels, and Daphne.

My Daphne command to run my asgi is:

daphne -b xxx.xxx.xxx.xx -p xxxx server.asgi:application

Any help is appreciated, Thank you.

NGINX-WSS connection failing but WS connection works

0 Answers0