因為部分需求(跟換頭像,切換輪播圖等等)改變圖片或者本地上傳新圖片,會導致圖片緩存問題,從而達不到預期效果,還是加載原圖片
查找了一些資料,總結出3個方法。
1.在圖片的路徑的后面拼接 '?內容' 解決,具體如下
(1)在圖片src路徑后面加上時間戳,使瀏覽器(移動端設備)認為每次加載的不是同個圖片。
例子:
1 <img width="188" height="150" src="url"> 2 3 timestamp(url) { 4 let getTimestamp = new Date().getTime(); 5 url= url + "?timestamp=" + getTimestamp 6 return url 7 }
(2)在圖片src路徑后面加上隨機數,使瀏覽器(移動端設備)認為每次加載的不是同個圖片。
例子:
1 <ul class="imglist" > 2 <li><img width="188" height="150" src="/images/photo/ico/pic_1_0128.jpg?random="> </li> 3 </ul> 4 5 $(".imglist").find("li").each(function(index,domEle){ 6 var obj = $(this).find("a").find("img"); 7 obj.attr("src",obj.attr("src")+Math.random()); 8 });
2.(瀏覽器)在中加入這3句話:
1 <meta http-equiv="pragma" content="no-cache"/> 2 <meta http-equiv="cache-control" content="no-cache"/> 3 <meta http-equiv="expires" content="0"/>
表示不要緩存數據