发布blazor应用到Linux, 使用nginx作为WebSocket代理

Blazor 使用了SignalR连接, 而SignalR使用的是WebSocket

WebSocket协议提供了一种创建支持客户端和服务器之间实时双向通信的 Web 应用程序的方法。作为 HTML5 的一部分，WebSocket 使开发此类应用程序比以前的方法容易得多。大多数现代浏览器都支持 WebSocket，包括 Chrome、Firefox、Internet Explorer、Opera 和 Safari，而且现在越来越多的服务器应用程序框架也支持 WebSocket。

对于企业生产用途，需要多个 WebSocket 服务器来实现性能和高可用性，因此需要一个能够理解 WebSocket 协议的负载平衡层，nginx自 1.3 版起就支持 WebSocket，可以充当反向代理并对 WebSocket 应用程序进行负载平衡。（nginx plus 的所有版本也都支持 WebSocket。）

查看有关 NGINX 可扩展性的最新性能测试，以平衡 WebSocket 连接的负载。

WebSocket 协议与 HTTP 协议不同，但 WebSocket 握手与 HTTP 兼容，可使用 HTTP 升级功能将连接从 HTTP 升级到 WebSocket。这使得 WebSocket 应用程序能够更轻松地融入现有基础设施。例如，WebSocket 应用程序可以使用标准 HTTP 端口 80 和 443，从而允许使用现有的防火墙规则。

WebSocket 应用程序在客户端和服务器之间保持长期连接，从而促进实时应用程序的开发。用于将连接从 HTTP 升级到 WebSocket 的 HTTP 升级机制使用Upgrade和Connection标头。反向代理服务器在支持 WebSocket 方面面临一些挑战。一个挑战是 WebSocket 是一种逐跳协议，因此当代理服务器拦截来自客户端的升级请求时，它需要向后端服务器发送自己的升级请求，包括适当的标头。此外，由于 WebSocket 连接是长寿命的，而不是 HTTP 使用的典型短寿命连接，因此反向代理需要允许这些连接保持打开状态，而不是因为它们似乎处于空闲状态而关闭它们。

nginx通过允许在客户端和后端服务器之间建立隧道来支持 WebSocket。为了让nginx将升级请求从客户端发送到后端服务器，必须明确设置Upgrade和Connection标头，如以下示例所示：

复制代码

location / {    
    proxy_pass http://localhost:5001;
    proxy_http_version 1.1;
    proxy_set_header Upgrade $http_upgrade;
    proxy_set_header Connection "Upgrade";
    proxy_set_header Host $host;
}

一旦完成后，nginx会将其作为 WebSocket 连接处理。

以下是我宝塔配置部分

复制代码

    # location ~ .*\.(gif|jpg|jpeg|png|bmp|swf)$
    # {
    #     expires      30d;
    #     error_log /dev/null;
    #     access_log /dev/null;
    # }

    # location ~ .*\.(js|css)?$
    # {
    #     expires      12h;
    #     error_log /dev/null;
    #     access_log /dev/null;
    # } 
    
    #以下为ssr配置
    #上面的 location ~ .*\.(js|css)?$ 和 location ~ .*\.(gif|jpg|jpeg|png|bmp|swf)$ 整段要注销    #add_header X-Frame-Options SAMEORIGIN;    
    #Redirects all traffic
    location / {
      proxy_pass http://localhost:5001;
      proxy_http_version 1.1;
      proxy_set_header Upgrade $http_upgrade;
      proxy_set_header Connection $connection_upgrade;
      proxy_set_header Host $host;
      proxy_cache_bypass $http_upgrade;
      proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
      proxy_set_header X-Forwarded-Proto $scheme;
    }