浏览器缓存笔记

浏览器一般不会缓存html文件，

• 通过meta标签禁止浏览器缓存html文件

 <meta http-equiv="Pragma" content="no-cache">  <meta http-equiv="Cache-Control" content="no-cache,no-store, must-revalidate">  <meta http-equiv="Expires" content="0">

• 可以通过php的header（）方法设置头部信息

header(‘Cache-Control:no-store’);
header(‘Pragma:no-cache’);
header(“Expires:0”);

• 可以使用打包工具在文件名后面加上MD5,时间戳,哈希值等随机数
  比如webpack打包，此时可以在webpack.config.js中对output的文件名进行配置

output: {
filename: “[name]-[hash:6].js” }

• 可以通过PHP 的 filemtime() 函数，filemtime()
  函数可以返回文件最后被修改的时间，这样只有在修改文件的时候版本才会变化。

<link rel="stylesheet" href="static/css/style.css?v=<?echo filemtime('static/css/style.css')?>">

置Cache-Control: no-cache并不会禁止掉浏览器的缓存操作，实际上Cache-Control: no-cache是会被缓存的，只不过每次在向客户端（浏览器）提供响应数据时，缓存都要向服务器评估缓存响应的有效性。
Cache-Control: no-store：这个才是响应不被缓存的意思。

要想禁止浏览器缓存css、js、jpg等的文件，可以通过Apache设置缓存
第一种方法：
1. 在Apache开启mod_expires.so模块 　
2. 在配置文件中打开：LoadModule expires_module modules/mod_expires.so
3. 在.htaccess添加以下内容：

<IfModule mod_expires.c>    #打开缓存    ExpiresActive On    #默认对所有资源缓存600秒    ExpiresDefault A600    #png格式的资源缓存5秒    ExpiresByType image/png A5    #jpg格式的资源缓存50秒    ExpiresByType image/jpg A50    #好含这些后缀的资源，都缓存100秒    <FilesMatch "\.(jpg|jpeg|png|gif|swf)$">    ExpiresDefault A100    </FilesMatch></IfModule>

第二种方法：
1. 在Apache开启mod_headers模块
2. 去配置文件中添加以下内容：LoadModule headers_module modules/mod_headers.so
3. 在.htaccess中添加内容：

#包含这些后缀的资源都缓存33秒<FilesMatch ".(flv|gif|jpg|jpeg|png|ico|swf)$">    Header set Cache-Control "max-age=33"</FilesMatch><FilesMatch ".(css|js)$">    Header set Cache-Control "no-store"</FilesMatch>

第三种方法：

1. 在.htaccess添加以下内容：

FileEtag INode Mtime Size

要关闭Etag，则添加以下内容：

FileEtag none