服务端缓存：
原文：
https://www.cnblogs.com/wpjamer/articles/7124087.html
客户端缓存：
原文：
https://blog.csdn.net/zhang_referee/article/details/88532172
nginx 图片缓存
最近准备用nginx搭建了一个图片服务器，看中的就是nginx超强的静态文件处理能力。
由于图片量比较大，和web服务器（也是nginx）分开运行，虽然web服务器调用图片没用问题，但毕竟是远程调用，肯定没有本地文件系统那么快，因此仍然有优化的空间。
使用前的nginx配置
location ~* ^.+.(js|ico|gif|jpg|jpeg|png|html|htm)$ {
log_not_found off;
access_log off;
expires 7d;
}
|
|
location ~ .*.(gif|jpg|jpeg|png|bmp|swf|js|html|htm|css)$ {
log_not_found off;
expires 7d ;
access_log off;
proxy_store on;
proxy_store_access user:rw group:rw all:rw;
if ( !-e $request_filename) {
proxy_pass http://img.example.com
}
}
默认的缓存路径位于 /var/cache/nginx/proxy_temp，里面将会保持图片服务器的目录结构
proxy_store 没有缓存过期，相当于镜像功能，这既是优点也是缺点，优点是访问快速，缺点是不知哪一天，硬盘会被撑爆，不过我们可以写个find脚本，定时清理一下缓存就OK了。
nginx还有一种缓存proxy_cache，它在设计上比proxy_store 更先进，采用内存+硬盘方式缓存，可以设置缓存大小和缓存过期。
http {
,,,,,
proxy_cache_path /var/cache/nginx/cache levels=1:2 keys_zone=imgcache:100m inactive=1d max_size=10g;
server {
........
location ~* ^.+.(js|ico|gif|jpg|jpeg|png|html|htm)$ {
log_not_found off;
access_log off;
expires 7d;
proxy_pass http://img.example.com ;
proxy_cache imgcache;
proxy_cache_valid 200 302 1d;
proxy_cache_valid 404 10m;
proxy_cache_valid any 1h;
proxy_cache_use_stale error timeout invalid_header updating http_500 http_502 http_503 http_504;
}
}
}
上面的代码将会使用一块最大100M的共享内存，用于硬盘上的文件索引，包括文件名和请求次数，每个文件在1天内若不活跃（无请求）则从硬盘上淘汰，硬盘缓存最大10G，满了则根据LRU算法自动清除缓存。
这种缓存方式为了更快的索引，采用hash分级来存储图片，图片目录结构和名称都变得面目全非，因此网页热点图片，必须通过其他途径统计，比如日志。
后一种方式更像一种正儿八经的缓存系统，应用相对更广，在性能上也更好。
本文针对nginx expires 设置进行讲解。nginx 缓存设置非常简单，可以设置在location /if 段里。
注:这个缓存是指针对浏览器所做的缓存,不是指服务器端的数据缓存.
下面就以具体的示例网站，针对该示例网站做实验。
一般缓存是针对不常发生变化的内容来做的缓存，在我们的这个示例网站中，可以看到图片是很多的，如果每次访问都请求加载很多图片资源的话，那是相当慢的，也是非常浪费服务器资源的。
ok，我们这边设置nginx 做下缓存，让浏览器一个星期内不再重复请求图片内容。
我们先看下，在没做缓存配置前的一个浏览器请求响应头信息：
注：我这里nginx 有配置过虚拟主机，把虚拟主机的配置单独抽离出来放在了vhosts 目录下，因此，下面所做的配置主要是针对该主机，如果配置在nginx.conf 文件中也同样适用的(前提要配置正确哦)。
配置如下：
-
location ~* .(jpg|jpeg|gif|png){
-
-
root /data/www/OneGame/public ;
-
expires 7d;
-
-
}
该配置表示：所有在/data/www/OneGame/public 目录下的以.jpg、.png、.gif、.jpeg为后缀 (不区分大小写)的文件缓存7天。
以下是我配置文件完整内容：
让nginx 重新载入配置
nginx -s reload然后强制刷新访问示例网站，查看一下图片的请求响应头信息。
可以看到响应头信息多了一个Cache-Control ，而且该值为：604800 ( 3600 * 24 * 7 ) ，该值单位为秒，即缓存7天。
再次刷新(非强制刷新)查看浏览器请求响应头信息
再次刷新后(非强制刷新)，可以查看到，状态码304的数据浏览器已经没有再请求服务器了
原理是：第一次浏览器访问资源，服务器响应Etag 验证令牌，Last-Modified 时间，Cache-Control:max-age 缓存时长，第二次浏览器发送请求的时候在HTTP If-None-Match 请求标头中加上ETAG 验证令牌，服务器根据当前请求资源核对令牌如果它未发生变化，服务器返回"304 Not Modified"响应，告知浏览器缓存中响应未发生变化，可以继续延用Cache-Control响应头中max-age时长。这次不必再次下载响应，这节约了时间和带宽。
浏览器发出的所有 HTTP 请求会首先路由到浏览器缓存，以确认是否缓存了可用于满足请求的有效响应。 如果有匹配的响应，则从缓存中读取响应，这样就避免了网络延迟和传送产生的流量费用。