1）向URL中添加唯一的緩存清除查詢參數(shù)，例如：

newImage.src = "image.jpg?t=" + new Date().getTime();
優(yōu)點： 100％的可靠，快速和易于理解和執(zhí)行。
缺點：繞過緩存完全，意味著不必要的延遲和帶寬使用時圖像不視圖間進(jìn)行變換。將潛在地填充瀏覽器緩存（和任何中間緩存）與許多，許多副本完全相同的圖像！此外，還需要修改圖片網(wǎng)址。
當(dāng)使用方法：使用時，圖像是不斷變化的，如用于現(xiàn)場攝像頭飼料。如果您使用此方法，請務(wù)必與服務(wù)圖像本身Cache-control: no-cache的HTTP頭！ （通常這可以使用.htaccess文件設(shè)置）。否則，你將逐漸填充高速緩存與舊版本的圖像！
（2）向URL中添加查詢參數(shù)，只有當(dāng)文件發(fā)生更改時，才會更改，例如：
echo '<img src="image.jpg?m=' . filemtime('image.jpg') . '">';
（這是php的服務(wù)器端代碼，但這里的重要的一點就是這樣一個？M = [文件最后修改時間]查詢字符串被附加到文件名）。
優(yōu)點： 100％的可靠，快速和易于理解和實施，并完美地保留緩存的優(yōu)勢。
缺點：需要修改圖像的URL。此外，為服務(wù)器多一點工作 - 它必須獲得文件最后修改的時間的訪問。另外，需要服務(wù)器端信息，因此不適合純客戶端方案來檢查刷新的映像。
使用時間：當(dāng)你希望緩存圖像，但可能需要在服務(wù)器端更新它們不時在不改變文件名本身。AND，當(dāng)您可以輕松地確保正確的querystring添加到HTML中的每個圖像實例。
（3）與頭即成您的圖像Cache-control: max-age=0, must-revalidate，以及獨特添加的memcache -busting片段標(biāo)識符的URL，如：
newImage.src = "image.jpg#" + new Date().getTime();
這里的想法是，緩存控制頭將圖像放在瀏覽器緩存中，但立即標(biāo)記它們陳舊，以便每次重新顯示時，瀏覽器都必須檢查服務(wù)器以查看它們是否已更改。這確保了瀏覽器的HTTP緩存總是返回圖像的最新副本。但是，如果瀏覽器有一個內(nèi)存中的副本，那么瀏覽器通常會重復(fù)使用它，甚至在這種情況下甚至不檢查它們的HTTP緩存。為了防止這種情況，一個片段標(biāo)識符用于：在內(nèi)存中的圖象比較src的包括片段標(biāo)識符，但它被查詢HTTP緩存之前剝?nèi)ァ＃ㄒ虼耍纾?code style="margin:0px; padding:1px 5px; border:0px; font-size:13px; font-family:Consolas,Menlo,Monaco,"Lucida Console","Liberation Mono","DejaVu Sans Mono","Bitstream Vera Sans Mono","Courier New",monospace,sans-serif; background-color:rgb(239,240,241); white-space:pre-wrap">image.jpg#A和image.jpg#B可能既從顯示image.jpg在瀏覽器的HTTP緩存條目，但image.jpg#B絕不會使用內(nèi)存中顯示從當(dāng)保留的圖象數(shù)據(jù)image.jpg#A最后被顯示）。
優(yōu)點：合理的利用的HTTP緩存機制，使用緩存圖像，如果他們沒有改變。適用于將查詢字符串添加到靜態(tài)圖片網(wǎng)址的服務(wù)器（因為服務(wù)器從不會看到片段標(biāo)識符 - 它們僅供瀏覽器自己使用）。
缺點：憑借瀏覽器（文件或至少很差）有點可疑的行為，就在他們的URL片段標(biāo)識符圖像（不過，我在FF27，Chrome33和IE11這個測試成功）。對于每個圖像視圖仍然發(fā)送重新驗證請求到服務(wù)器，如果圖像只有很少變化和/或延遲是一個大問題，這可能是過度的（因為您需要等待重新驗證響應(yīng)，即使緩存的圖像仍然是好的） 。需要修改圖片網(wǎng)址。
何時使用：使用時，圖像可能會經(jīng)常發(fā)生變化，或者需要由客戶端刷新間歇性無服務(wù)器端腳本參與，但如果你仍然想緩存的優(yōu)勢。例如，輪詢每幾分鐘不規(guī)律地更新圖像的實況網(wǎng)絡(luò)攝像頭。或者，如果您的服務(wù)器不允許靜態(tài)圖片網(wǎng)址的查詢字符串，請使用（1）或（2）。
（4）強行刷新使用javascript特定的圖像，首先加載到一個隱藏<iframe>，然后調(diào)用location.reload(true)的iframe的contentWindow。
步驟是：
將要刷新的圖像加載到隱藏的iframe中。這只是一個設(shè)置步驟 - 如果需要，它可以提前實際刷新。如果圖像在這個階段無法加載甚至不重要！
完成后，您的網(wǎng)頁或任何DOM節(jié)點中的任何位置（即使在Javascript變量中存儲的頁外）中的所有副本都會被清空。您需要確保所有：因為瀏覽器可能會以其他方式展示從陳舊的內(nèi)存中拷貝圖像（IE11尤其是做到這一點），這是必要的內(nèi)存拷貝都被清零，刷新HTTP緩存之前。如果其他JavaScript代碼以異步方式運行，您可能還需要阻止該代碼在此期間創(chuàng)建待刷新圖像的新副本。
呼叫iframe.contentWindow.location.reload(true)。該true部隊緩存旁路，直接從服務(wù)器重裝并覆蓋現(xiàn)有的緩存副本。
一旦它完成重新 -loading，后立刻圖像。他們現(xiàn)在應(yīng)該從服務(wù)器顯示新版本！
對于相同域的圖片，您可以直接將圖片加載到iframe中。對于跨域圖像，你要代替加載HTML網(wǎng)頁，從您的域名包含在圖像<img>標(biāo)記，否則你會得到嘗試調(diào)用時錯誤“訪問被拒絕” iframe.contentWindow.reload(...)。
優(yōu)點：工作就像image.reload（）函數(shù)，你希望的DOM了！允許通過正常緩存圖像（即使有未來的到期日期，如果你想要的話，從而避免頻繁的重新驗證）。允許您在不更改當(dāng)前網(wǎng)頁或其他網(wǎng)頁（僅使用客戶端代碼）上的圖片的網(wǎng)址的情況下刷新特定圖片。
缺點：憑借的JavaScript。不是100％保證在每個瀏覽器正常工作（我已經(jīng)測試這成功在FF27，Chrome33和IE11雖然）。相對于其他方法非常復(fù)雜。
何時使用：當(dāng)你有，你想緩存基本上是靜態(tài)圖像的集合，但你仍然需要能夠偶爾更新它們，并得到即時的視覺反饋，該更新發(fā)生。（特別是當(dāng)只刷新整個瀏覽器頁面不工作，例如在一些基于Ajax的web應(yīng)用程序）。當(dāng)方法（1） - （3）不可行，因為（無論什么原因）你不能更改可能顯示圖像的所有URL，你需要更新。（請注意，使用的3種方法，圖像將被刷新，但如果另一個頁面，然后嘗試顯示該圖像沒有相應(yīng)的查詢字符串或片段標(biāo)識符，它可能會顯示一個舊版本代替）。