如何有效地使用瀏覽器緩存進行圖像？

我希望像圖片這樣的靜態內容儘可能長時間被緩存，但如果這些圖片在服務器上發生變化，我希望瀏覽器更新它們。

2011-09-01 chobo

與往常一樣：所需*最大*高速緩存持續時間的組合，並確保服務器返回未修改的內容。智能服務器也可能使用[ETags]（http://en.wikipedia.org/wiki/HTTP_ETag），這將允許在最後修改日期之後進行更多控制。 – 2011-09-01 17:36:35

靜態內容的一種非常整潔的緩存方法是在URL中編碼靜態內容的版本。然後「通知」瀏覽器下載新的靜態內容只是向客戶端提供新的URL。


# first version access (1.1/main.css will never expire) 
# e.g. by far future Cache-Control + Expires Header 
<link ... href="/static/1.1/main.css 

# after upgrading/releasing trigger fresh download 
<link ... href="/static/1.2/main.css

它涉及到一些努力，你的構建+部署過程，但從緩存控制它是非常簡單的。

來源

2011-09-01 19:05:59

實際上，這通常是唯一可行的解決方案。 – EricLaw

因此，如果我有一個過期或cahce控制標題與說yeat到期，沒有辦法告訴瀏覽器檢查是否一個項目已更新？ – chobo

基本上2 cache-style：1）Conditional-GET（瀏覽器正在做一個調用來檢查新內容，例如ETag或If-Modified-Since，導致304 Not-Modified或200 OK更新內容）。 2）告訴瀏覽器根本不打一個電話（例如Cache-Control：max-age，Expires標題）。 2）具有的優點是，您根本不會造成流量，但具有無法執行更新強制的缺點。所以我會使用樣式2），只有當我確定內容（通過URL標識）不會得到更新（請參閱我的初始答案）。 –

如何有效地使用瀏覽器緩存進行圖像？

回答

相關問題