☰

在 React 网站上使用 nginx 启用 SSL 后，网站速度非常慢

tag-icon • tag-icon linux nginx ubuntu vps nginx-reverse-proxy
在 React 网站上使用 nginx 启用 SSL 后，网站速度非常慢

这是我的 Digital Ocean Ubuntu v22 VPS 上的 nginx 站点可用文件夹：

server{   server_name 139.59.62.131 animeanyway.me;

      location / {
        proxy_pass http://localhost:3000;
        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection 'upgrade';
        proxy_set_header Host $host;
        proxy_cache_bypass $http_upgrade;
    }

    listen 443 ssl; # managed by Certbot
    ssl_certificate /etc/letsencrypt/live/animeanyway.me/fullchain.pem; # managed by Certbot
    ssl_certificate_key /etc/letsencrypt/live/animeanyway.me/privkey.pem; # managed by Certbot
    include /etc/letsencrypt/options-ssl-nginx.conf; # managed by Certbot
    ssl_dhparam /etc/letsencrypt/ssl-dhparams.pem; # managed by Certbot } server{
    if ($host = animeanyway.me) {
        return 301 https://$host$request_uri;
    } # managed by Certbot

}

以前，没有 SSL，它看起来像这样：

server{   server_name 139.59.62.131;

      location / {
        proxy_pass http://localhost:3000;
        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection 'upgrade';
        proxy_set_header Host $host;
        proxy_cache_bypass $http_upgrade;
    }

}

并且这个版本的代码比第一个版本快得多，知道为什么会发生这种情况吗？

我尝试对这个文件进行多次修改，但有时不起作用，当它与 http（我展示的第二个代码）一起工作时，速度很快，而当我启用所有内容时，速度非常慢。

我不知道为什么会发生这种情况，所以如果能提供任何帮助我将不胜感激！

答案1

您应该先自己分析问题。将源响应时间和请求响应时间添加到您的日志中。查看浏览器中的 Web 开发人员工具中的流量。检查您的错误日志。

server_name 139.59.62.131 animeanyway.me;
...
    if ($host = animeanyway.me) {
        return 301 https://$host$request_uri;

我觉得这很奇怪。我预计这会导致重定向循环，该循环永远无法解决，或者重定向到会导致证书验证失败的 IP 地址。

我估计这可能是在前端讨论 HTTP/1.1。虽然可能与您当前的问题无关，但建议配置 HTTP/2 支持。

另外，您绝不应该使用裸域名作为您的网络服务器的规范名称；相应的 DNS 记录只能是“A”记录。

相关内容