強制瀏覽器重新讀取緩存的圖像

.button { background：url（../ Images/button.png）; }強制瀏覽器重新讀取緩存的圖像

問題：由於性能原因，所有靜態內容都有過期標題並被瀏覽器緩存。當圖像更改時，用戶必須刷新緩存（IE中的Ctrl + F5）。我希望圖像被緩存，但必要時必須自動重新加載。

問題：下一個方法'有效'？

.button { 
    background: url(../Images/button.png?v=1234); 
}

其中v = 1234是我的網站版本。我不知道在CSS中編寫這樣的東西是否是100％有效，如果版本相同，我希望瀏覽器仍然可以緩存圖片。所有現代瀏覽器是否正確使用URL參數部分緩存數據？

謝謝。

來源

2009-09-09 Roman

我相信這不適用於每個瀏覽器。有些人忽略查詢字符串。也許你可以添加版本的圖像的名稱。有框架可以幫助你做到這一點，所以你不需要有button_v1.png，button_v2.png等。 – 2009-09-09 12:30:26

我的網站的好消息 - 它不需要在IE6下正確工作100％。如果'1234'是IE7-8，Firefox 3 +，最新的Chrome，Opera和Safari的有效解決方案，那麼這種解決方案適用於我。 – Roman 2009-09-09 13:21:46

對我來說這看起來很不錯，它在現代瀏覽器的CSS中可以正常工作 - 瀏覽器會查看圖像的地址（包括?v=1234），查看它沒有被緩存，併發送一個新的請求。

來源

2009-09-09 12:28:26

投票的原因是什麼？ – rahul 2009-09-09 12:32:33

這並不完全正確.. IE是最討厭的一個，實際上能夠忽略散列鏈接和緩存控制標題。Altought這是「最好」的方法.. – yoda 2009-09-09 12:32:59

它可能與原始問題的評論「我認爲這不適用於每個瀏覽器「，如果有足夠的瀏覽器支持它，這似乎是一種有效的方法 – 2009-09-09 12:35:18

這在High Performance Web Sites規則3中討論：「添加過期或緩存控制標題」。建議的方法之一是版本的文件，而不是網站。

從accompanying blog：

請記住，如果你使用一個遙遠的未來過期，你必須更改組件的文件名只要組件的變化頭。在Yahoo！我們經常使這一步成爲構建過程的一部分：組件的文件名中嵌入了一個版本號，例如，yahoo_2.0.6.js。

來源

2009-09-09 12:31:43

我用JavaScript和CSS文件做這樣的文件版本命名（例如yahoo_2.0.6.js），但是要重命名所有已更改的圖像要困難得多，這就是爲什麼我想要一些不需要修改圖像文件名稱的方法，另外一個缺點是使用'？1234'方法 - 新版本的網站會使所有圖像無效，即使沒有修改，但至少在維護時不那麼痛苦。 – Roman 2009-09-09 13:17:45

強制瀏覽器重新讀取緩存的圖像

回答

相關問題