Nginx配置WebSocket反向代理

桃扇骨 2024-03-22 22:22 97阅读 0赞

### 1、WebSocket协议 ###

WebSocket协议相比较于HTTP协议成功握手后可以多次进行通讯，直到连接被关闭。但是WebSocket中的握手和HTTP中的握手兼容，它使用HTTP中的Upgrade协议头将连接从HTTP升级到WebSocket。这使得WebSocket程序可以更容易的使用现已存在的基础设施。

### 2、Nginx配置WebSocket反向代理 ###

$ vim /usr/local/nginx/conf/nginx.conf (nginx配置文件)

# 在http上下文中增加如下配置，确保Nginx能处理正常http请求。
    
    http {
        
        
      # 根据请求头中的"Upgrade"字段来确定是否升级连接。如果请求头中的"Upgrade"字段的值为"default"，则将其升级为"upgrade"。
        如果请求头中的"Upgrade"字段的值为空字符串（即没有"Upgrade"字段），则将连接关闭。
        对于其他情况，默认将"Upgrade"字段的值设为"upgrade"。
      map $http_upgrade $connection_upgrade {
        
        default upgrade;
        ''   close;
      }
        
      # 定义了一个名为"websocket"的负载均衡集群。
      upstream websocket {
        
        #ip_hash; # 这是一个负载均衡算法的注释，表示使用IP哈希算法进行负载均衡。
        server localhost:8010;  # 指定一个后端服务器地址
        server localhost:8011;
      }
    
      # 以下配置是在server上下文中添加，location指用于websocket连接的path。
      server {
        
        listen       80;
        server_name localhost;
        access_log /var/log/nginx/yourdomain.log;
    
        location / {
        
          proxy_pass http://websocket;
          proxy_http_version 1.1; # 指定使用HTTP/1.1协议进行代理
          proxy_set_header Upgrade $http_upgrade; # 将请求头中的"Upgrade"字段的值传递给后端服务器。
          proxy_set_header Connection $connection_upgrade; # 请求头中的"Connection"字段的值设为"upgrade"，表示要升级连接。
    	  proxy_connect_timeout 4s; # 设置与后端服务器建立连接的超时时间为4秒。
    	  proxy_read_timeout 7200s; # 置从后端服务器读取响应的超时时间为7200秒。
    	  proxy_send_timeout 12s; # 设置向后端服务器发送请求的超时时间为12秒。
    	  proxy_set_header Host $host; # 将请求头中的"Host"字段的值设为当前请求的主机名。
          proxy_set_header X-Real-IP $remote_addr; # 将请求头中的"X-Real-IP"字段的值设为客户端的真实IP地址。
          proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; # 将请求头中的"X-Forwarded-For"字段的值设为客户端IP地址的列表，这样后端服务器就可以知道请求的真实来源IP。
    	  proxy_set_header HTTP_X_FORWARDED_FOR $remote_addr; # 将请求头中的"HTTP_X_FORWARDED_FOR"字段的值设为客户端的真实IP地址。
    	  proxy_set_header X-Forwarded-Proto $scheme; # 将请求头中的"X-Forwarded-Proto"字段的值设为请求的协议类型（HTTP或HTTPS）。
    	  proxy_redirect   default; # 默认启用代理重定向。
        }
      }
    }

核心是下面的配置 其他和普通反向代理没区别, 表示请求服务器升级协议为WebSocket

proxy_set_header Upgrade $http_upgrade;
    proxy_set_header Connection $connection_upgrade;

这里面的关键部分在于HTTP的请求中多了如下头部：

Upgrade: websocket
    Connection: Upgrade

这两个字段表示请求服务器升级协议为WebSocket。服务器处理完请求后，响应如下报文：

# 状态码为101
    HTTP/1.1 101 Switching Protocols
    Upgrade: websocket
    Connection: upgrade

告诉客户端已成功切换协议，升级为Websocket协议。握手成功之后，服务器端和客户端便角色对等，就像普通的Socket一样，能够双向通信。不再进行HTTP的交互，而是开始WebSocket的数据帧协议实现数据交换。

![\[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-XqnLRKLi-1690603346484)(E:\\PRD\\Images\\image-20230729114740230.png)\]][img-XqnLRKLi-1690603346484_E_PRD_Images_image-20230729114740230.png]

### 3、配置反向代理常见问题 ###

#### 3.1 为什么要配置Host参数？ ####

WebSocket反向代理需要配置host参数的原因是WebSocket协议的特性。在WebSocket协议中，客户端在建立与服务端的WebSocket连接时，会发送一个Origin头部字段，用于标识请求的来源。这个Origin字段的值通常是客户端的域名。

当使用反向代理来代理WebSocket请求时，代理服务器会接收到客户端的WebSocket连接请求。如果没有配置host参数，代理服务器会将自己的主机名作为Origin字段的值发送给服务端。而服务端在验证WebSocket连接时会比较Origin字段的值与其预期的值是否一致，如果不一致，则会拒绝连接。

为了解决这个问题，需要在反向代理配置中明确指定host参数，将客户端的原始域名作为host参数的值发送给服务端。这样服务端就能正确验证WebSocket连接的来源，从而确保连接的安全性和正确性。

#### 3.2 WebSocket反向代理为什么要设置http协议为1.1版本 ####

当使用WebSocket反向代理时，将HTTP协议版本设置为1.1是为了确保与WebSocket协议的兼容性和正常工作。

WebSocket协议是在HTTP协议基础上进行升级的，它的握手过程与HTTP握手类似。在进行WebSocket握手时，客户端会发送一个类似HTTP请求的握手请求，然后服务器进行响应，最终建立WebSocket连接。在这个过程中，需要使用HTTP的一些特性和头部字段。

将HTTP协议版本设置为1.1是因为WebSocket握手过程使用了HTTP/1.1的一些新特性，包括`Upgrade`头部字段和`Connection`头部字段的值设置为`Upgrade`。当HTTP协议版本为1.1时，代理服务器能够正确理解并处理这些头部字段，从而正确地转发WebSocket握手请求和响应。

如果将HTTP协议版本设置为较低的版本，如HTTP/1.0，代理服务器可能无法正确处理WebSocket握手请求，导致握手失败或连接无法建立。因此，为了保证WebSocket反向代理的正常工作，一般会将HTTP协议版本设置为1.1版本。

需要注意的是，虽然WebSocket握手过程使用了HTTP协议，但WebSocket连接建立后，实际上是通过WebSocket协议进行数据传输的，而不是HTTP协议。所以，一旦建立了WebSocket连接，HTTP协议版本的设置对后续的数据传输没有影响。

感谢博主：https://blog.csdn.net/weixin\_42083036/article/details/110133421

[img-XqnLRKLi-1690603346484_E_PRD_Images_image-20230729114740230.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/14/2d290e1fc8d74e37904d1012daf9f2d9.png