failed: Error during WebSocket handshake: net::ERR_CONNECTION_RESET

前言

最近同事9G 詢問他們的系統在內容同仁執行都沒問題，但是如果透過外網連接的話，就會發生以下的錯誤
failed: Error during WebSocket handshake: net::ERR_CONNECTION_RESET

測試

連到 piesocket 輸入 WSS 的 URL 來測試，如下，

可以發現它有錯誤，查看 Console 它的錯誤就是 failed: Error during WebSocket handshake: net::ERR_CONNECTION_RESET

同事9G系統的架構是 nginx <-> web-ap(docker) ， 記得另一個案子也是使用 WebScoket ，但因為客戶 Firewall 的關係，所以造成 WebScoket 發生錯誤。
詢問同事Vantist ，他回答因為客戶的 Firewall 沒有 pass Http 的2個 Header 分別如下，

Upgrade: websocket
Connection: Upgrade

同事9G 在 nginx 那有設定上述的那2個 header ，於是請他把那2個設定從 nginx 拿掉。
再執行程式，就會發生一樣的 failed: Error during WebSocket handshake: net::ERR_CONNECTION_RESET 錯誤。

客戶的透過外網的架構猜想是 WAF <-> nginx <-> web-ap(docker) ，所以應該是因為那2個 Header 沒有 pass 到 nginx ，所以導致系統 WebScoket 錯誤，所以就請同事跟客戶確認是否有將 WebScoket 停用。

在網路上有查到關於 NetScaler 在針對 WebScoket 有設定，詳細可參考 Setting up WebSocket access on Citrix NetScaler

如果有類似的問題，可以請大家 Check 一下是否是因為那2個 Header 沒有傳到 Web Server 哦!

另外，許多 Scoket Client 都有 Support 走 webscoket or long polling ，當 webscoket 不通時，會自動改用 long polling ，
只是當它走 long polling 時，有的會透過 iframe ，所以如果設定 X-Frame-Options: DENY 時，請改成 SAMEORIGIN 哦!

參考資料

Test & Debug WebSocket Server Connections Online.
Setting up WebSocket access on Citrix NetScaler
Protocol upgrade mechanism
sockjs-client
X-Frame-Options