H5緩存-Manifest的範例程式碼分享（圖文）
- 黄舟原創
- 2017-04-01 11:56:232545瀏覽
在app中更新h5頁面一直有緩存問題。只能卸載重裝(are u kidding me?)。一點之後，頁面加入no-cache.
<meta http-equiv="Cache-Control" content="no-cache">
告訴瀏覽器不要快取頁面。不是說每次都全新下載，而是更新了就會重新下載。 4s更新了，6sp還是老樣子。了。嘆號的圖片和人物的頭像都顯示不出來。 ，man
ifest
manifest
介紹可以先看w3shool的：www.w3school.com.cn/html5/html_5_app_cache.asp ,這裡就說下使用的情況。
location / {
root html; expires -1;
index index.html index.htm;
}3.設定nginx mimenginx -s reloadmime types檔案都在conf目錄下。 ##這個圖說明2個事情，一個是流程上會先下載index.appcache，然後會陸續觸發checking event,download event，progress event 和updateReady event.二個是預設快取了當前頁面。而且居然是帶個參數也緩存。看樣子只要地址不一樣的當前頁都給緩存了(上面的緩存目錄我只寫了一個zepto)。再刷新頁面：
index.appcache沒有更新就不會觸發檢查。
載入快取的檔案狀態
是200，size一欄是from cache。從瀏覽器載入的是304，時間上一個是幾毫秒，一個是十幾毫秒。 f12進入開發者模式，在Application cache一欄可以看見已快取的檔案。但在這個地方是無法清理的，需要在Application 中的
clearstorage來清理。
最明顯的就是首頁，預設為快取下來。這個時候你改變首頁內容而不修改index.appache是完全沒有作用的。例如你刪掉一個js的
引用
<html manifest="index.appcache">注意到雖然index.appache和index位於同一級，但不能寫index.html，得寫相當於網站的路徑，其他資源也是一樣。這時候觸發更新了，但頁面還是載入的快取資源，所以還需要做一個處理：
window.applicationCache.addEventListener("updateready", function(){
location.reload()
});
这样才会加载最新的页面。如果首页再发生修改，可以随意(加个空格，加空行)修改缓存文件，就能触发更新。所以剩下的问题就是记得在更新资源之后记得更新缓存文件。建议就是不变的资源(框架样式，框架js，图片)缓存下来，经常要修改的js就让浏览器缓存吧。现在这样就避免了reload nginx。这个效果要比加no-cache的方法好。当然，如果无所谓消息或者reload的影响。no-cache还是很方便，毕竟这个index.appache一旦加上，难以去掉，除非清理缓存。
以上是H5緩存-Manifest的範例程式碼分享（圖文）的詳細內容。更多資訊請關注PHP中文網其他相關文章！
陳述：
本文內容由網友自願投稿，版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容，請聯絡admin@php.cn