☰

使用 Angular 在 Nginx 反向代理上實現緩慢的 TTFB（60 秒）

tag-icon • tag-icon nginx reverse-proxy
使用 Angular 在 Nginx 反向代理上實現緩慢的 TTFB（60 秒）

有問題的伺服器正在運行 Ubuntu 16.04，透過反向代理為 Angular 應用程式提供服務。連接到主頁面後，並非所有頁面都需要很長時間才能加載，但有些頁面確實需要這麼長時間。即https://mysite/admin頁。這裡還有一些缺少的 js 按鈕，儘管頁面的所有其他方面都顯示在頁面上，但這些按鈕並未顯示在頁面上。我們的網站是為了使用js 腳本路由流量而建立的，但這是具有60 秒TTFB 的檔案之一！無法工作，但我可以確認，當它沒有生效。此外，補充一點可能會有所幫助：網站上的 TTFB 並不總是在第一次加載後 60 秒，但在隱身視窗中加載時總會如此。

nginx.conf

user www-data;
worker_processes 1;
pid /run/nginx.pid;
events {
        worker_connections 1024;
}

http {
    proxy_cache_path /etc/nginx-cache levels=1:2 keys_zone=backcache:8m max_size=50m;                                                                                                                                                         
    proxy_cache_key "$scheme$request_method$host$request_uri$is_args$args";
    proxy_cache_valid 200 302 10m;
    proxy_cache_valid 404 1m;

    client_body_buffer_size 10K;
    client_header_buffer_size 1k;
    client_max_body_size 8m;
    large_client_header_buffers 2 1k;

    upstream mysite {
            server [::]:1337;
     }


    ##
    # Basic Settings
    ##

    sendfile on;
    tcp_nopush on;
    tcp_nodelay on;
    keepalive_timeout 65;
    types_hash_max_size 2048;

    include /etc/nginx/mime.types;
    default_type application/octet-stream;

    #Looked at 12/4
    #fastcgi_buffers 8 16k;
    #fastcgi_buffer_size 32k;

    #client_max_body_size 24M;
    #client_body_buffer_size 128k;

    ##
    # SSL Settings
    ##

    ssl_protocols TLSv1 TLSv1.1 TLSv1.2; # Dropping SSLv3, ref: POODLE
    ssl_prefer_server_ciphers on;

    ##
    # Logging Settings
    ##

    access_log /var/log/nginx/access.log;
    error_log /var/log/nginx/error.log;

    ##
    # Gzip Settings
    ##

    gzip on;
    gzip_disable "msie6";
     application/javascript                                                                                                                                                              text/xml application/xml application/xml+rss text/javascript;

    ##
    # Virtual Host Configs
    ##

    include /etc/nginx/conf.d/*.conf;
    include /etc/nginx/sites-enabled/*;
}

站點啟用/default.conf

server {
        listen 80 default_server;
        listen [::]:80 default_server;
        listen 443 ssl http2; # managed by Certbot
        ssl_certificate /etc/letsencrypt/live/mysite.net-0001/fullchain.pem; # managed by Certbot
        ssl_certificate_key /etc/letsencrypt/live/mysite.net-0001/privkey.pem; # managed by Certbot

        root /home/admin_user/root;

        index index.html index.htm index.nginx-debian.html;

        server_name mysite.net;

        proxy_buffering on;
        proxy_buffer_size 1k;
        proxy_buffers 24 4k;
        proxy_busy_buffers_size 8k;
        proxy_max_temp_file_size 2048m;
        proxy_temp_file_write_size 32k;

        location / {
                sendfile on;
                tcp_nopush on;
                tcp_nodelay on;
                proxy_cache backcache;
                proxy_cache_bypass $http_cache_control;
                add_header X-Proxy-Cache $upstream_cache_status;

                proxy_set_header Upgrade $http_upgrade;
                proxy_set_header Connection 'upgrade';
                proxy_set_header Host $host;

                proxy_http_version 1.1;
                proxy_set_header Connection "";
                proxy_pass http://localhost:1337;
    }
}

答案1

好的，根據您的訊息，我認為您有一個複製貼上的反向代理 nginx 配置設定。

您的配置具有以下節：

location / {
            sendfile on;
            tcp_nopush on;
            tcp_nodelay on;
            proxy_cache backcache;
            proxy_cache_bypass $http_cache_control;
            add_header X-Proxy-Cache $upstream_cache_status;

            proxy_set_header Upgrade $http_upgrade;
            proxy_set_header Connection 'upgrade';
            proxy_set_header Host $host;

            proxy_http_version 1.1;
            proxy_set_header Connection "";
            proxy_pass http://localhost:1337;
}

這說明 - 對於 下的任何內容/，請將您的評論中的請求發送到localhost:1337可能不存在的位置。 Nginx 有 60 秒超時，所以我猜它會等待那麼長時間，然後回退到以下位置傳遞文件/home/admin_user/root

您需要做的是將配置更改為：

server {
        listen 80 default_server;
        listen [::]:80 default_server;
        listen 443 ssl http2; # managed by Certbot
        ssl_certificate /etc/letsencrypt/live/mysite.net-0001/fullchain.pem; # managed by Certbot
        ssl_certificate_key /etc/letsencrypt/live/mysite.net-0001/privkey.pem; # managed by Certbot

        index index.html index.htm index.nginx-debian.html;

        server_name mysite.net;

        location / {
            root /home/admin_user/root;
        }
    }

由於 Angular 是客戶端渲染的應用程式 - 您沒有被代理程式的支援伺服器。因此，只需交付 中的資產即可/home/admin_user/root。

相關內容