web-dev-qa-db-ja.com

アセットのNginx confに「expires」ディレクティブを追加すると「404 not found」エラーが発生する

Gunicorn、nginx、supervisordを実行しているDjangoサイトがあります。 nginxでgzipを使用してページの速度スコアを上げるために、 here で見つかった提案を実装しようとしています。結果の構成ファイルは次のとおりです。

upstream app_server_wsgiapp {
   server 127.0.0.1:8000 fail_timeout=0;
}

server {
   listen 80;
   server_name www.example.com;
   return 301 https://www.example.com$request_uri;
}

server {
    server_name           www.example.com;
    listen                443 ssl;

    if ($Host = 'example.com') {
      return 301 https://www.example.com$request_uri;
    }

    ssl_certificate       /etc/nginx/example/example.crt;
    ssl_certificate_key   /etc/nginx/example/example.key;
    ssl_session_timeout   1d;
    ssl_session_cache     shared:SSL:50m;
    ssl_protocols         TLSv1.1 TLSv1.2;
    ssl_ciphers           'ECDHE-RSA-AES128-GCM-SHA256:ECDHE-ECDSA-AES128-GCM-SHA256:ECDHE-RSA-AES256-GCM-SHA384:ECDHE-ECDSA-AES256-GCM-SHA384:DHE-RSA-AES128-GCM-SHA256:DHE-DSS-AES128-GCM-SHA256:kEDH+AESGCM:ECDHE-RSA-AES128-SHA256:ECDHE-ECDSA-AES128-SHA256:ECDHE-RSA-AES128-SHA:ECDHE-ECDSA-AES128-SHA:ECDHE-RSA-AES256-SHA384:ECDHE-ECDSA-AES256-SHA384:ECDHE-RSA-AES256-SHA:ECDHE-ECDSA-AES256-SHA:DHE-RSA-AES128-SHA256:DHE-RSA-AES128-SHA:DHE-DSS-AES128-SHA256:DHE-RSA-AES256-SHA256:DHE-DSS-AES256-SHA:DHE-RSA-AES256-SHA:AES128-GCM-SHA256:AES256-GCM-SHA384:AES128-SHA256:AES256-SHA256:AES128-SHA:AES256-SHA:AES:CAMELLIA:DES-CBC3-SHA:!aNULL:!eNULL:!EXPORT:!DES:!RC4:!MD5:!PSK:!aECDH:!EDH-DSS-DES-CBC3-SHA:!EDH-RSA-DES-CBC3-SHA:!KRB5-DES-CBC3-SHA';
    ssl_prefer_server_ciphers   on;
    access_log            /var/log/nginx/www.example.com.access.log;
    error_log             /var/log/nginx/www.example.com.error.log info;
    keepalive_timeout     5;
    proxy_read_timeout    120s;

    # nginx serve up static and media files and never send to the WSGI server
    location /static {
        autoindex on;
        alias /path/to/static/files;
    }

    location /media {
        autoindex on;
        alias /path/to/media/files;
    }

    location / {
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header Host $http_Host;
        proxy_redirect off;
        if (!-f $request_filename) {
            proxy_pass http://app_server_wsgiapp;
            break;
        }
    }

    gzip on;
    gzip_comp_level    5;
    gzip_min_length    256;
    gzip_proxied       any;
    gzip_vary          on;

    gzip_types
    application/atom+xml
    application/javascript
    application/json
    application/ld+json
    application/manifest+json
    application/rss+xml
    application/vnd.geo+json
    application/vnd.ms-fontobject
    application/x-font-ttf
    application/x-web-app-manifest+json
    application/xhtml+xml
    application/xml
    font/opentype
    image/bmp
    image/svg+xml
    image/x-icon
    text/cache-manifest
    text/css
    text/plain
    text/vcard
    text/vnd.rim.location.xloc
    text/vtt
    text/x-component
    text/x-cross-domain-policy;

    location ~*  \.(jpg|jpeg|png|gif|ico|css|js|pdf)$ {
        expires 7d;
    }
}

Nginxを再起動してブラウザでサイトを開いた後、すべてが正常に表示されます。それから ここのページ速度 をチェックすると、私のスコアは確かに増加しました。

問題は、サイトに戻ってCtrl+F5を押してページを完全に更新し、静的ファイルを再ダウンロードすると（すべてが正しく機能することを確認するため）、静的ファイルがダウンロードされないことです。 。次のブラウザコンソールエラーが表示されます。

GET https://www.example.com/path/to/static/files 404 (Not Found)
etc...
etc...

静的ファイルが見つからないか、ダウンロードされません。 nginx構成ファイルを編集し、最後の3行をコメントアウトしてnginxを再起動すると、_CTRL+F5を押しても機能します。

# location ~*  \.(jpg|jpeg|png|gif|ico|css|js|pdf)$ {
#     expires 7d;
# }

そのため、問題はこれらの3行に関連するもののようです。ただし、これらの3行はコメントアウトされているため、gzipを使用しようとするポイントを無効にするページ速度の増加はありません。

performancepage-speednginxdjango
3
darkpool

locationブロックは加算的ではありません。 nginxは、locationブロックを選択して要求を処理します。新しいlocationブロックを追加すると、既存のlocationブロックがリクエストを処理できなくなります。詳細については このドキュメント をご覧ください。

複数のlocationディレクティブを持つ複数のaliasブロックがあるので、既存のexpiresブロックに継承されるグローバルlocationディレクティブを使用する方が簡単かもしれません。

例えば：

map $request_uri $expires {
    default off;
    ~*\.(jpg|jpeg|png|gif|ico|css|js|pdf)(\?|$) 7d;
}
server {
    ...
    expires $expires;
    ...
    location ... {
        ...
    }
    ...
}

詳しくは このドキュメント をご覧ください。

3
Richard Smith