failed: Error during WebSocket handshake: Unexpected response code: 404

websocket 连接404

本地可以访问websocket，但是部署到服务器上就不行，不过本地用的配置是vue.config.js，没走nginx代理。
但是其中又这么一句话，用来删除路径的：

pathRewrite: {
                    '^/abc/socket': ''
                }

所以nginx上也需要把这个路径去掉，否则会把/abc/socket 拼到后端的路径上，会报404找不到。
而我在nginx上之前配置的代理路径没加 / ，所以就没去掉这个路径。
最后服务器上nginx配置如下：

 upstream abc-api {
        server 192.168.xx.xx:80;
    }

location /abc/socket/ {
            proxy_pass http://abc-api/;
            proxy_http_version 1.1;
            proxy_set_header Upgrade $http_upgrade;
            proxy_set_header Connection "upgrade";
                
        }

也就是上面的proxy_pass，原来是 proxy_pass http://abc-api ，少了/

当然其他原因就是没有设置下面的proxy_set_header，最后你可以把nginx日志打开，直接看日志，看最后访问后端拼接成的地址是什么，就知道哪错了。