一個項目要上線考慮到項目的訪問速度問題，必然要用到瀏覽器的緩存，緩存有了之後訪問速度問題解決了，但是項目會不定時更新，替換了服務器上的文件，瀏覽器依然使用緩存就會出問題，不使用緩存又會給服務器造成壓力並且浪費寬帶資源。有沒有什麼辦法能讓瀏覽器對於不改動的文件使用緩存，一旦服務器改動了某個文件，就能讓瀏覽器知道並重新向服務器拉取最新的資源？
一、首先要弄明白的是瀏覽器的緩存機制，下面這篇博客寫的很清楚了網上也能搜出一大堆，引用一下：
http://www.cnblogs.com/skynet/archive/2012/11/28/2792503.html，
二、明白了瀏覽器的緩存機制之後，現在來比較主流瀏覽器對於緩存處理的區別，這些比較都是在win7 64位系統下親自測試：
對於瀏覽器的第一次請求都是200從服務器拉取，以下的比較都是從第二次請求開始
對於html文件來說
| 瀏覽器 | 地址欄回車 | F5 | CTRL+F5 |
| chrome(47.0.2526.106 m (64-bit)) | 主頁面304，嵌套頁面200(from cache) | 主頁面304，嵌套頁面200(from cache) | 主頁面304，嵌套頁面200(from cache) |
| 360（兼容IE8） | 主頁面304，嵌套頁面200(from cache) | 主頁面304，嵌套頁面200(from cache) | 主頁面304，嵌套頁面200(from cache) |
| firefox（v43.0.1) | 200(from cache) | 304 | 200 |
IE10 | 304 | 304 | 主頁面200，嵌套頁 面304 |
對於css、js和圖片來說
| 瀏覽器 | 地址欄回車 | F5 | CTRL+F5 |
| chrome(47.0.2526.106 m (64-bit)) | 200(from cache) | 直接引用304，間接引用200(from cache) | 直接引用以及直接引用文件裏的文件都是200，間接引用200(from cache) |
| 360（兼容IE8） | 200(from cache) | 直接引用304，間接引用200(from cache) | 直接引用以及直接引用文件裏的文件都是200，間接引用200(from cache) |
| firefox（v43.0.1) | 200(from cache) | 304 | 200 |
IE10 | js和css返回304，圖片200(from cache) | 304 | 直接引用的文件200，間接引用的文件304 |
這有篇參考：
http://www.iptu.net/archives/4565.html
http://www.cnblogs.com/ziyunfei/archive/2012/09/13/2683177.html
這裏需要提到一點的就是現在的360安全瀏覽器和360急速瀏覽器都是雙核的，默認情況下使用的chrome內核，在使用網銀時會自動切換到IE內核，IE內核使用的是你當前系統自帶的IE版本
看到chrome瀏覽器和chrome內核的瀏覽器對於文件緩存使用的情況，這就很明白了，爲什麼有的時候更新了文件，但是使用者怎麼刷新都還是老文件的原因，每次更新文件總讓使用者清楚緩存很不現實，現在還是回到一開始的那個問題，有沒有什麼辦法能讓瀏覽器對於不改動的文件使用緩存，一旦服務器改動了某個文件，就能讓瀏覽器知道並重新向服務器拉取最新的資源？
目前能做到這點的方法有兩個方向可以考慮：
1、設置服務器響應頭信息Cache-Control max-age=0，讓資源有效期始終是0，這樣瀏覽器再次發送請求就會配合if-modified-since頭信息詢問服務器從上次請求到現在資源是否被修改過，如果沒有修改就返回304，被修改過了就會返回200，它可以解決上面提到的問題，但是這個方法會每次都浪費時間和網絡資源在詢問上，在正式環境中沒有人提倡這麼幹的
這種方式在nginx服務器配置如下：
#針對html頁面有效
location / {
root /xxx/xxx;
index index.html;
add_header Cache-Control max-age=0;
}
#對圖片等有效（如果是谷歌瀏覽器，css裏引用的圖片無效）
location ~ .*\.(gif|jpg|jpeg|png|bmp|swf)$ {
root /xxx/xxx/;
add_header Cache-Control max-age=0;
}
#對js和css有效
location ~ .*\.(js|css)$ {
root /xxx/xxx;
add_header Cache-Control max-age=0;
}
2、還有一個方法就是給文件名添加版本號，可以把所有的文件都設置成無限期限緩存，每次修改更新的時候，文件名會因爲版本號而修改，這就相當於一個新的資源，從而瀏覽器會從新向服務器拉取，不會再使用緩存，而那些沒有修改過的文件版本號不會變化，繼續使用緩存，這看起來是個完美的方案，但是面臨的問題是項目文件很多，如何修改這麼的文件名？並且還有那些在文件內容中引用的連接
有一個前臺框架叫nodejs，裏面有很多插件，fis是其中一種，可以使文件名加上按內容計算一個hash值後綴，相當於文件版本號，只要內容不要，hash值不會變化
參看連接：
http://www.infoq.com/cn/articles/front-end-engineering-and-performance-optimization-part1
http://fis.baidu.com/fis3/docs/beginning/install.html
http://fis.baidu.com/fis3/docs/beginning/release.html#%E6%96%87%E4%BB%B6%E6%8C%87%E7%BA%B9
我試過發佈靜態項目，文件名都能變過來，它支持遞歸編譯，就是按照引用的順序修改文件名，
<link rel="stylesheet" type="text/css" href="/css/base_69c89ac.css">s
<script type="text/javascript" src="/js/coon/require_0afe4ef.js"></script>
.login_bg_bg{ background:url(/images/bg1_dde2f95.png)}
像上面這些地方在src，href，url()，這些引用的地方都能改過來，只是文檔上說它編譯過來後的路徑是絕對路徑，建議編譯前多使用相對路徑的方式，對於fis的功能及配置都是剛剛瞭解，還沒找到合適配置辦法，現在只是感覺它能解決就是不會用，╮(╯▽╰)╭，回頭看看再來更新。
如果看到文章寫的有什麼錯誤和缺陷歡迎指正評論。