Secure WebSocket (wss://) doesn't work on Firefox

Question

I have a working WebSocket non secure application. But my website uses https and I need a Secure WebSocket connection to avoid Firefox to complain about the fact that the connection is insecure.

I am using php-websocket-server for my WebSocket server with PhP 5.2.9, so when i use WebSocket secure i can't decrypt packets with the openssl_decrypt function.

That's why i used stunnel in order to decrypt packets sent by the client using wss, to do that i binded client WebSocket to 12345 port an server WebSocket to 54321 port, then i added a stunnel in server mode :

[wsServer]
accept  = 12345
connect = 192.168.1.227:54321

With this configuration my application works fine on Chrome through https + wss. But on Firefox there's a problem during the handshake, it seems that Sec-WebSocket-Version and Sec-WebSocket-Key are missing in the header. I don't understand because it works on Firefox through http + ws.

Thanks in advance for your help.

Edit : i added an exception for the certificate on the port 12345, now the handshake is going well because i think Firefox now have the Sec-WebSocket-Key.

Here the working header request with Firefox (bigger than Chrome request):

GET / HTTP/1.1
Host: 192.168.1.227:12345
User-Agent: Mozilla/5.0 (Windows NT 6.1; WOW64; rv:14.0) Gecko/20100101 Firefox/14.0.1
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/;q=0.8
Accept-Language: fr,fr-fr;q=0.8,en-us;q=0.5,en;q=0.3
Accept-Encoding: gzip, deflate
DNT: 1
Connection: keep-alive, Upgrade
Sec-WebSocket-Version: 13
Origin: https://192.168.1.227
Sec-WebSocket-Protocol: HyBi-00
Sec-WebSocket-Key: 65nHN33M6drIPjQHcGK8pA==
Pragma: no-cache
Cache-Control: no-cache
Upgrade: websocket

Entirely

If you can show the actual headers/handshakes in both directions for the working and non-working case I can probably identify quickly what the problem is. – Coagulate

Answer 1

If you work in local with auto-signed certificate, you have to approve it on both servers https:// running on port 443 and wss:// running on port 12345 here with Firefox.

I think your browser does not allow the secure websocket connection and that why some headers are missing.

[Update from @Faisal comments as it is really important]
Answer is right but a little bit unclear. Ok here is it.
When you would try to open up wss say using wss://mysite.com:12345, Firefox will keep on giving you error until you open up a separate Firefox tab and do try hitting URL [https]://mysite.com:12345 and Confirm Security Exception (like you do on Firefox normally for any https based connection).
This is really weird and happens only in Firefox.

Subclinical

When i looked in the console, the WebSocket request was aborded, i right clicked on it and i opened the request in a new tab. The URL in the new tab was https://192.168.1.227:12345/ and Firefox asked me to accept the certificate for the port 12345. The first time i tried, Firefox asked me to accept the https port but not the port 12345. – Entirely

Answer is right but a little bit unclear. Ok here is it. When you would try to open up wss say using wss://mysite.com:12345, Firefox will keep on giving you error until you open up a separate Firefox tab and do try hitting URL [https]://mysite.com:12345 and Confirm Security Exception (like you do on Firefox normally for any https based connection). This is really weird and happens only in Firefox. – Fetter

Hi. I'm recently encountering pretty much the same kind of error on Chrome/Brave browser with a let's encrypt certificate on my wss subdomain (port 443) - the certificate is trusted by browser. The socket connection is not working until I'm opening the url in a new tab. In Firefox all works as expected without any issues. Does anyone have any clues on this? – Substratum

Answer 2

I had the same issue. You can try with an SSL port like https://192.168.1.227:54321. Then allow exception or go to firefox setting -> certificate manager -> servers and add an exception site

Prepared