如何设置Nginx缓存来减少H5流量

末蓝、 2022-02-19 19:51 352阅读 0赞

## 指令含义 ##

#### expires ####

控制HTTP应答中的"Expires"和"Cache-Control"的头标。  
通过设置浏览器缓存资源的过期时间，来降低服务器的请求压力。

*  **expires 30d** 过期时间为30天(浏览器30天后自动清除该资源)
 *  **expires max** 过期时间为 31 December 2037(浏览器能保存的最长时间)
 *  **expires -1** 永远过期(等同于不缓存)
 *  expires off 不修改"Expires"和"Cache-Control"的值

#### if\_modified\_since ####

*  语法：if\_modified\_since \[off|exact|before\]
 *  默认值：if\_modified\_since exact
 *  使用环境：location http server

指定Nginx如何用服务器端的`Last-Modified`和浏览器端的`if-modified-since`时间进行比较。

exact表示精确匹配，before表示更早。也就是说，如果服务器端文件的最后修改时间等于或早于浏览器端的`if-modified-since`时间，就返回304，表示浏览器端缓存文件是最新的，无需请求新的内容，这样可以减少网络传输，减轻服务器的负担。

off表示不比较。

#### etag ####

静态资源会自动添加Etag，相当于文件的一个标记，如无必要，可以通过`etag off` 指令禁止生成Etag，来降低CPU的计算压力。

## 总结 ##

尽量设置`expires`为`max`，代表浏览器尽可能把文件缓存到本地，这样在非第一次请求资源时就不会再次下载，而是自动使用本地缓存。如果文件使用了MD5，则设置`if-modified-since`为off，代表无需比较文件的最后修改时间。

一个常用的Nginx配置实例如下。

location / {
        root   /usr/share/nginx/hello;
        index  index.html index.htm;
        expires max;
        etag off;
        if-modified-since off;
    }

发表评论取消回复

表情：

评论列表（有 0 条评论，352人围观）

还没有评论，来说两句吧...

相关阅读

相关摄像头的RTSP视频如何用H5 来播放

随着各行各业安防系统的建设，激增了摄像头视频web播放的需要。为此需要一个web播放器来播放摄像头的视频。想做好一个能兼容所有浏览器和所有摄像头编码的web播放器存在很

た入场券/ 2024年03月24日 00:35/ 0 赞/ 47 阅读

相关 H5当中的web缓存

localStorage 方法存储的数据没有时间限制保存数据 localStorage.setItem("name", “Jack"); 读取数据

悠悠/ 2022年12月25日 11:55/ 0 赞/ 92 阅读

相关 WebView自动H5缓存-清除缓存ios

iOS的Webview加载HTML时会自动缓存JS、CSS等文件，当下次加载HTML时会根据请求的缓存策略是否使用缓存本地的JS和CSS，如果本地有缓存，那么直接返回本地资源(

╰+哭是因爲堅強的太久メ/ 2022年10月09日 14:30/ 0 赞/ 210 阅读

相关 nginx的缓存设置

user nobody; worker_processes 1; error_log logs/error.log; error

港控/mmm°/ 2022年09月20日 15:22/ 0 赞/ 180 阅读

相关 nginx---浏览器设置缓存

对常见格式的图片文件等在浏览器本地缓存，对于css,js等文件在浏览器本地缓存. 语法：expires \[time|epoch|max|off 默认值：off ex

╰+哭是因爲堅強的太久メ/ 2022年06月12日 00:49/ 0 赞/ 321 阅读

相关 h5离线缓存技术

HTML5提供了很多新的功能以及相应的接口，离线存储就是其中的一个，离线存储可以将站点的一些文件存储在本地，在没有网络的时候还是可以访问到以缓存的对应的站点页面，其中这些文

布满荆棘的人生/ 2022年05月21日 01:22/ 0 赞/ 270 阅读

相关 H5缓存机制

做过返回页面定位的功能，因为带分页，所以用了缓存sessionStorage，请见[博客][Link 1]，然后顺便又了解了其他的缓存机制。一、消除缓存 //方法

野性酷女/ 2022年04月02日 06:29/ 0 赞/ 231 阅读

相关如何设置Nginx缓存来减少H5流量

指令含义 expires 控制HTTP应答中的"Expires"和"Cache-Control"的头标。通过设置浏览器缓存资源的过期时间，来降低服务器的请求压

末蓝、/ 2022年02月19日 19:51/ 0 赞/ 353 阅读

相关 Nginx缓存设置

在开发调试web的时候，经常会碰到因浏览器缓存(cache)而经常要去清空缓存或者强制刷新来测试的烦恼，提供下apache不缓存配置和nginx不缓存配置的设置。在常用的

ゞ浴缸里的玫瑰/ 2021年09月25日 10:28/ 0 赞/ 359 阅读

相关 H5可以用来干什么？

H5可以用来干什么？ H5是 HTML5 的简称，而HTML5是指“HTML”的第5个版本。但因为html5规则对视频音频和触屏互动等事件的支持远超前代，因此H5逐渐演变...

灰太狼/ 2020年06月08日 16:46/ 0 赞/ 726 阅读