nginx处理websocket连接

素颜马尾好姑娘i 2022-12-27 14:06 181阅读 0赞

最近开发的时候需要用到websocket向前端推送消息,本地测试正常（ip+端口的方式）,但是部署到测试服务器上之后连接失败。  
测试环境是使用nginx作为代理，并没有配置关于websocket的地方。  
需要在nginx配置文件中添加websocket配置，才能正常使用

> WebSocket和HTTP虽然是不同协议，但是两者“握手”方式兼容。通过HTTP升级机制，使用HTTP的Upgrade和Connection协议头的方式可以将连接从HTTP升级为WebSocket。

在nginx配置文件中添加两个地方  
在http模块中添加：

> map是根据客户端请求中 $http\_upgrade 的值来构造改变 $connection\_upgrade 的值，即根据变量  
> $http\_upgrade 的值和\{\} 里规则创建新的变量 $connection\_upgrade并赋值。

map $http_upgrade $connection_upgrade {
                     default upgrade;
                     '' close;
                     }

在该域名的server模块中增加：

> HTTP的Upgrade协议头机制用于将连接从HTTP连接升级到WebSocket连接，Upgrade机制使用了Upgrade协议头和Connection协议头；为了让Nginx可以将来自客户端的Upgrade请求发送到后端服务器，Upgrade和Connection的头信息必须被显式的设置。如下图代码中的红圈。  
> ![在这里插入图片描述][20201211160821152.png]

server {
            listen       80;
            server_name  域名;
            #以下是增加websocket配置，开发的请求配置是ws://域名/webSocket/17816016/1这个样式的
            #所以将这个后端域名中对webSocket进行配置，
            location /webSocket/ {
                     proxy_pass http://localhost:7033;
                     proxy_http_version 1.1;
                     proxy_set_header Upgrade $http_upgrade;
                     proxy_set_header Connection "upgrade";
                    }
    }

配置完成后，记得检查nginx配置文件是否正确，没问题在重新加载nginx

[root@localhost ~]# nginx -t
    [root@localhost ~]# nginx -s reload

在一个测试网站上检验一下（http://coolaf.com/tool/chattest）![在这里插入图片描述][20201211160835195.png]

进入开发者模式，也可以看到![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MzkzMTM1OA_size_16_color_FFFFFF_t_70]

配置完成，Nginx就可以处理WebSocket连接了

[20201211160821152.png]: /images/20221120/0bfceb4b29b447328d908dd026a0974c.png
[20201211160835195.png]: /images/20221120/7ef1011ff61240b38f5457ecb6a04bb8.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MzkzMTM1OA_size_16_color_FFFFFF_t_70]: /images/20221120/56d64fff4eaf47bd821ee11d08bc27dd.png