文章/答案/技术大牛

发布

社区首页 >问答首页 >NGINX浏览器缓存不起作用- Node JS EC2

问NGINX浏览器缓存不起作用- Node JS EC2
EN

Stack Overflow用户

提问于 2018-06-14 21:34:01

回答 1查看 1.7K关注 0票数 3

浏览了几篇文章，但不明白为什么浏览器缓存不起作用。我使用的是prerender.io和SSL：

gzip on;
gzip_min_length  500;
gzip_proxied     any;
gzip_comp_level 4;
gzip_types  text/css text/javascript text/xml text/plain text/x-component application/javascript application/json application/xml application/rss+xml font/truetype font/opentype application/vnd.ms-fontobject image/svg+xml;
gzip_vary on;
gzip_disable     "msie6";

server {
    listen 8080 default_server;
    listen [::]:8080 default_server;
    server_name <servername> www.<servername>.com;
    return 301 https://$server_name$request_uri;
}

server {
    listen 443 ssl http2 default_server;
    server_name <servername> www.<servername>.com;

    ssl_certificate /etc/pki/tls/private/<servername>.com.chained.crt;
    ssl_certificate_key /etc/pki/tls/private/private.key;
    ssl_protocols TLSv1 TLSv1.1 TLSv1.2;
    ssl_prefer_server_ciphers on;
    ssl_ciphers <ssl_ciphers_code>

    ssl_session_cache shared:SSL:5m;
    ssl_session_timeout 1h;
    add_header Strict-Transport-Security "max-age=15768000" always;

    root /var/app/current;

    location / {
        proxy_set_header X-Prerender-Token iKJwgCElYIfxtt9u99Zg;

        set $prerender 0;
        if ($http_user_agent ~* "baiduspider|twitterbot|facebookexternalhit|rogerbot|linkedinbot|embedly|quora link preview|showyoubot|outbrain|pinterest|slackbot|vkShare|W3C_Validator") {
            set $prerender 1;
        }
        if ($args ~ "_escaped_fragment_") {
            set $prerender 1;
        }
        if ($http_user_agent ~ "Prerender") {
            set $prerender 0;
        }
        if ($uri ~* "\.(js|css|xml|less|png|jpg|jpeg|gif|pdf|doc|txt|ico|rss|zip|mp3|rar|exe|wmv|doc|avi|ppt|mpg|mpeg|tif|wav|mov|psd|ai|xls|mp4|m4a|swf|dat|dmg|iso|flv|m4v|torrent|ttf|woff|svg|eot)") {
            set $prerender 0;
        }

        #resolve using Google's DNS server to force DNS resolution and prevent caching of IPs
        resolver 8.8.8.8;

        if ($prerender = 1) {
            #setting prerender as a variable forces DNS resolution since nginx caches IPs and doesnt play well with load balancing
            set $prerender "service.prerender.io";
            rewrite .* /$scheme://$host$request_uri? break;
            proxy_pass http://$prerender;
        }

        # Proxy_pass configuration
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header Host $http_host;
        proxy_set_header X-NginX-Proxy true;
        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection "upgrade";
        proxy_max_temp_file_size 0;
        proxy_pass http://0.0.0.0:3000;
        proxy_redirect off;
        proxy_read_timeout 240s;
    }

    location ~* \.(ico|css|js|gif|jpeg|jpg|png|woff|ttf|otf|svg|woff2|eot)$ {
        root /var/app/current/app/dist/client/; #if i comment this out it, my css and js files are not found...
        expires 30d;
        access_log  off;
        log_not_found off;
        add_header  Pragma "public";
        add_header  Cache-Control "public";
    }

    # Increase http2 max sizes
    http2_max_field_size 64k;
    http2_max_header_size 64k;
    client_max_body_size 4G;
    keepalive_timeout 10;
}

我的资产总额如下：

JS: /var/app/current/app/dist/client/js

CSS: /var/app/current/app/dist/client/assets/css

Images: /var/app/current/app/dist/client/assets/graphics

Fonts: /var/app/current/app/dist/client/assets/fonts

Videos: /var/app/current/app/dist/client/assets/videos

更新配置：

gzip on;
gzip_min_length  500;
gzip_proxied     any;
gzip_comp_level 4;
gzip_types  text/css text/javascript text/xml text/plain text/x-component application/javascript application/json application/xml application/rss+xml font/truetype font/opentype application/vnd.ms-fontobject image/svg+xml;
gzip_vary on;
gzip_disable     "msie6";

server {
  listen 8080 default_server;
  listen [::]:8080 default_server;
  server_name <servername.com> <www.servername.com>;
  return 301 https://$server_name$request_uri;
}

server {
  listen 443 ssl http2 default_server;
  server_name <servername.com> <www.servername.com>;

  ssl_certificate /etc/pki/tls/private/<servername>.com.chained.crt;
  ssl_certificate_key /etc/pki/tls/private/private.key;
  ssl_protocols TLSv1 TLSv1.1 TLSv1.2;
  ssl_prefer_server_ciphers on;
  ssl_ciphers <ciphers>;

  ssl_session_cache shared:SSL:5m;
  ssl_session_timeout 1h;
  add_header Strict-Transport-Security "max-age=15768000" always;

  root /var/app/current;

  location / {
      proxy_set_header X-Prerender-Token <token> ;

      set $prerender 0;
      if ($http_user_agent ~* "developers\.google\.com|googlebot|gigabot|yeti|yandex|ia_archiver|baiduspider|twitterbot|facebookexternalhit|rogerbot|linkedinbot|embedly|quora link preview|showyoubot|outbrain|pinterest|slackbot|vkShare|W3C_Validator") {
          set $prerender 1;
      }
      if ($args ~ "_escaped_fragment_") {
          set $prerender 1;
      }
      if ($http_user_agent ~ "Prerender") {
          set $prerender 0;
      }
      if ($uri ~* "\.(js|css|xml|less|png|jpg|jpeg|gif|pdf|doc|txt|ico|rss|zip|mp3|rar|exe|wmv|doc|avi|ppt|mpg|mpeg|tif|wav|mov|psd|ai|xls|mp4|m4a|swf|dat|dmg|iso|flv|m4v|torrent|ttf|woff|svg|eot)") {
          set $prerender 0;
      }

      #resolve using Google's DNS server to force DNS resolution and prevent caching of IPs
      resolver 8.8.8.8;

      if ($prerender = 1) {
          #setting prerender as a variable forces DNS resolution since nginx caches IPs and doesnt play well with load balancing
          set $prerender "service.prerender.io";
          rewrite .* /$scheme://$host$request_uri? break;
          proxy_pass http://$prerender;
      }

      # Proxy_pass configuration
      proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
      proxy_set_header Host $http_host;
      proxy_set_header X-NginX-Proxy true;
      proxy_http_version 1.1;
      proxy_set_header Upgrade $http_upgrade;
      proxy_set_header Connection "upgrade";
      proxy_max_temp_file_size 0;
      proxy_pass http://0.0.0.0:3000;
      proxy_redirect off;
      proxy_read_timeout 240s;
  }

  location ~* \.(ico|css|js|gif|jpeg|jpg|png|woff|ttf|otf|svg|woff2|eot)$ {
      root /var/app/current/app/dist/client/; #if i comment this out it, my css and js files are not found...
      expires 30d;
      access_log  off;
      log_not_found off;
      add_header  Pragma "public";
      add_header  Cache-Control "public";
  }

  location /assets/graphics/ {
    proxy_ignore_headers Cache-Control;
    proxy_cache_valid any 30d;
  }

  # Increase http2 max sizes
  proxy_buffers 8 16k;
  proxy_buffer_size 32k;
  http2_max_field_size 64k;
  http2_max_header_size 64k;
  client_max_body_size 4G;
  keepalive_timeout 10;
}

node.js

nginx

caching

amazon-ec2

browser-cache

回答 1

Stack Overflow用户

回答已采纳

发布于 2018-06-18 12:20:51

在NGINX配置中，您将图像的缓存过期时间设置为30天，行如下：

expires 30d;

但是，查看来自服务器的图像，图像的最大年龄设置为0，这将导致浏览器在刷新时重新拉出图像(下面的图像是刷新后的图像)：

我怀疑NGINX是作为您的解决方案一部分的源服务器的代理。此源服务器将缓存控制头中的最大年龄设置为0，而NGINX则尊重该设置。

根据NGINX缓存指南

默认情况下，NGINX尊重来自原始服务器的缓存-控制头。它不缓存响应，将缓存控制设置为私有、无缓存或无存储，或者在响应头中设置Cookie。NGINX只缓存获取和领导客户端请求。

若要覆盖源服务器上的cache-control集并将最大年龄设置为30d，请使用NGINX proxy_ignore_headers和proxy_cache_valid指令，如下所示：

...
location /assets/graphics/ {

    proxy_ignore_headers Cache-Control;
    proxy_cache_valid any 30d;
    ...
}
...

我的解决方案中的代码直接取自NGINX缓存指南并修改为您的配置。

或确定如何更改源服务器上的缓存控制标头。

更新

在更新了NGINX之后，/assets/graphics/目录中的图像将从本地浏览器内存中提取，并且过期30天(2595200天)，如下所示。昨天，它们都是从您的服务器中取出的，而不是缓存的。这个解决方案解决了你的问题。对于您想要缓存的其他资产，您需要进一步更改配置，以便根据您的需求缓存这些资产。

票数 5

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/50866263

复制

相似问题

问NGINX浏览器缓存不起作用- Node JS EC2
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问NGINX浏览器缓存不起作用- Node JS EC2EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问NGINX浏览器缓存不起作用- Node JS EC2
EN