如何在 Nginx 上使用高效的缓存策略服务静态资产？

Posted 2023-03-28

【中文标题】如何在 Nginx 上使用高效的缓存策略服务静态资产？

【英文标题】：How to serve static assets with an efficient cache policy on Nginx?

【发布时间】：2020-07-17 21:30:48

【问题描述】：

在手机上？？？？

我正在尝试改善我网站的页面负载

我加了

# Media: images, icons, video, audio, HTC
location ~* \.(?:jpg|jpeg|gif|png|ico|cur|gz|svg|svgz|mp4|mp3|ogg|ogv|webm|htc|woff2|woff)$ 
    expires 1M;
    access_log off;
    add_header Cache-Control "public";


# CSS and javascript
location ~* \.(?:css|js)$ 
    expires 1y;
    access_log off;
    add_header Cache-Control "public";

由于某些原因，我觉得我刚刚添加到 nginx 的更改没有任何效果。

https://developers.google.com/speed/pagespeed/insights/?url=https%3A%2F%2Fwww.bunlongheng.com%2F

我应该如何进一步调试？

【参考方案1】：

您缺少来自http://nginx.org/en/docs/http/ngx_http_headers_module.html 的max-age 指令

我不认为你真的希望 CSS 和 JS 文件过期这么久，但我可能是错的。

另外，没有登录图像和所有这些文件类型？如果您获得热链接或提供找不到的 CSS/JS 文件怎么办。

我会重新考虑您的缓存控制。

# Media: images, icons, video, audio, HTC
location ~* \.(?:jpg|jpeg|gif|png|ico|cur|gz|svg|svgz|mp4|mp3|ogg|ogv|webm|htc|woff2|woff)$ 
    expires 1M;
    access_log off;
    # max-age must be in seconds
    add_header Cache-Control "max-age=2629746, public";


# CSS and Javascript
location ~* \.(?:css|js)$ 
    expires 1y;
    access_log off;
    add_header Cache-Control "max-age=31556952, public";