JS、CSS 文件的版本號控制

首先,介紹幾個常用的 HTTP 響應的狀態碼:

200 - 服務器已成功處理了請求,並返回所請求的內容。

304 - 自從上次請求後,請求的內容未修改過,瀏覽器直接從本地緩存中取得,服務器則不會返回。

404 - 服務器找不到請求的內容,通常,對於服務器上不存在的網頁經常會返回此狀態碼。


回到本文主題,一般瀏覽器打開網頁時都會對 JS、CSS 文件進行緩存,以便在下次打開時可以直接從緩存中取出,而不用費勁地向服

務器再次請求。可是如果 JS、CSS 文件在服務器那邊被修改過,瀏覽器從本地緩存中取得的文件就不是最新的了。


這個問題怎麼解決?其中一個方法就是爲 JS、CSS 文件加上版本號,如:

<link rel="stylesheet" href="/Public/css/index.css?version=20160223" />

<script src="/Public/js/search.js?version=20160223" type="text/javascript"></script>

每當 JS、CSS 文件被修改時,就在調用它的路徑後面把版本號也給改了,這樣一來,瀏覽器檢測到版本號發生變化,就會向服務器重新請求相應的 JS、CSS 文件了。


在 Google 瀏覽器的調試工具中,Network 選項卡可以查看文件的請求/響應情況,狀態碼爲 200 表示文件從服務器傳來的,304 

表示文件是取自瀏覽器緩存的。


但是我改變版本號之後,第一次刷新(F5,非 Ctrl+F5)還是 304,要刷新兩到三次才變成 200。這個問題還需進一步研究......


這個方法的缺點就是:每次修改文件,都要改寫版本號,而且如果在多個地方調用了這個文件,還要改多個地方。

所以有必要尋找更好地版本控制的方法。






發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章