通過代碼示例跟我學(xué)html5相關(guān)技術(shù)——html5脫機(jī)應(yīng)用技術(shù)及實(shí)例-在線瀏覽
2025-01-11 20:20本頁面
【正文】 che Manifest”文件，在該文件中指明需要緩存的資源文件名稱。 楊教授工作室 精心創(chuàng)作的優(yōu)秀程序員 職業(yè)提升必讀系列資料 楊教授工作室，版權(quán)所有，盜版必究 ， 6/19 頁 6 在本示例的 中聲明了本示例中 3 個(gè)需要緩存的資源文件：“ ”、“ ”和“ ”。當(dāng)然，它還可以包括視頻、 PDFs、 XML 文件等。 另外，其中的版本信息也并不是規(guī)范中的一部分。但是，擁有這樣的信息很關(guān)鍵，因?yàn)榭梢允褂迷撔畔砀嬷獮g覽器您的應(yīng)用程序有一個(gè)新版本。 （ 6）引用 清單文件 要啟用某個(gè)應(yīng)用的應(yīng)用緩存，請(qǐng)?jiān)谖臋n的 html 標(biāo)記中添加 manifest 屬性以引用 清單文件。 Web 瀏覽器需要知道是否啟用緩存以及到哪里去找到緩存清單文件。只需要修改 頁面，并將頁面中的 html標(biāo)簽中 的“ manifest”屬性設(shè)置為對(duì)前面的“ ”文件名的引用。修改后的 頁面的標(biāo)簽代碼如下： !DOCTYPE HTML html manifest= head titleClock/title 也可以指定相對(duì)的文件目錄 楊教授工作室 精心創(chuàng)作的優(yōu)秀程序員 職業(yè)提升必讀系列資料 楊教授工作室，版權(quán)所有，盜版必究 ， 7/19 頁 7 link rel=stylesheet href= /head body pThe time is: output id=clock/output/p /body /html 當(dāng)用戶在線訪問“ ”時(shí)，瀏覽器會(huì)緩存“ ”頁面本身以及與它相關(guān)的其它資源文件 —— “ ”和“ ”等文件；而當(dāng)用戶離線訪問時(shí)，這個(gè) Web 應(yīng)用也同樣可以正常使用了。 如果在頁面的 html標(biāo)簽內(nèi)不包含有 manifest 屬性，瀏覽器就不會(huì)緩存該頁面（除非該頁面已經(jīng)在“ Cache Manifest”清單文件中明確定義了）。因此，開發(fā)人員無需再在“ Cache Manifest”清單文件中羅列定義出這些 Web 頁面文件本身。 為此，需要配置 Web 服務(wù)器設(shè)置一個(gè)靜態(tài)文件的 MIME 類型，或者必須編寫一些代碼來動(dòng)態(tài)創(chuàng)建該文件并設(shè)置 MIME 類型。 如果系統(tǒng)管理人員對(duì)服務(wù)器擁有控制權(quán)且正在使用一個(gè) J2EE 應(yīng)用程序服務(wù)器，只需要在 Web 應(yīng)用程序的 文件中配置這個(gè) MIME 類型參數(shù)。 （ 1）自動(dòng)更新 瀏覽器除了在第一次訪問 Web 應(yīng)用時(shí)緩存資源外，只會(huì)在“ Cache Manifest”文件本身的內(nèi)容發(fā)生變化時(shí)才會(huì)更新緩存中的對(duì)應(yīng)的資源文件；但如果僅僅是“ Cache Manifest”文件中的相關(guān)資源文件發(fā)生變化瀏覽器并不會(huì)立即觸發(fā)更新行為 —— 比如開發(fā)人員修改了系統(tǒng)中的相關(guān)圖片資源或更改了 JavaScript 程序代碼，這些更改不會(huì)導(dǎo)致重新緩存，此時(shí)則需要在應(yīng)用程序中通過代碼等方式手動(dòng) 觸發(fā)更新或者通過修改“ Cache Manifest”文件的內(nèi)容而產(chǎn)生自動(dòng)觸發(fā)更新的效果。該方法不僅可以很明確地區(qū)分離線 Web 應(yīng)用的版本，而且還可以輕易地通知瀏覽器更新緩存中的相關(guān)資源文件 —— 要表明一個(gè)新的清單文件，只需更改現(xiàn)有清單文件的部分或全部內(nèi)容。示例代碼如下： if( == )｛ “ Cache Manifest”文件的存儲(chǔ)位置 的擴(kuò)展名 楊教授工作室 精心創(chuàng)作的優(yōu)秀程序員 職業(yè)提升必讀系列資料 楊教授工作室，版權(quán)所有，盜版必究 ， 9/19 頁 9 ()。其中的 status 有五種無符號(hào)的短整型值的狀態(tài)： 1) UNCACHED = 0，此時(shí) applicationCache 對(duì)象的緩存宿主與應(yīng)用緩存無關(guān)聯(lián)； 2) IDLE = 1，應(yīng)用緩存已經(jīng)是最新的，并且沒有標(biāo)記為 obsolet； 3) CHECKING = 2， applicationCache 對(duì)象的緩存宿主已經(jīng)和一個(gè)應(yīng)用緩存關(guān)聯(lián)，并且該緩存的更新狀態(tài)是 checkin； 4) DOWNLOADING = 3， applicationCache 對(duì)象的緩存宿主已經(jīng)和一個(gè)應(yīng)用緩存關(guān)聯(lián)，并且該緩存的更新狀態(tài)是 downloadin； 5) UPDATEREADY = 4， applicationCache 對(duì)象的緩存宿主已經(jīng)和一個(gè)應(yīng)用緩存關(guān)聯(lián)，并且該緩存的更新狀態(tài)是 idle，并且沒有標(biāo)記為 obsolete，但是緩存不是最新的； 6) OBSOLETE = 5， applicationCache 對(duì)象的緩存宿主已經(jīng)和一個(gè)應(yīng)用緩存關(guān)聯(lián)，并且該緩存的更新狀態(tài)是 obsolete。因此可以使用 . swapCache()函數(shù)更新到最新的緩存，這個(gè)不會(huì)使得之前加載的資源突然被重新加載。 緩存更新過程中的相關(guān)事件 （ 1）緩存新過程中的相關(guān)事件 applicationCache 對(duì)象再更新緩存的過程中會(huì)觸發(fā)各種事件。 （ 2）主要的相關(guān)事件 applicationCache 對(duì)象的更新過程所觸發(fā)的事件主要是： 1) onchecking（檢查 manifest 文件是否存在） 2) onerror（其他和離線存儲(chǔ)有關(guān)的錯(cuò)誤） 3) onnoupdate（返回 304 表示緩存名單沒有被更改，通知瀏覽器直接使用本地文件） 4) ondownloading（檢查到有 manifest 或者 manifest 文件已更新就執(zhí)行下載操作，開始重新下載緩存名單中列出的每個(gè)資源文件） 楊教授工作室 精心創(chuàng)作的優(yōu)秀程序員 職業(yè)提升必讀系列資料 楊教授工作室，版權(quán)所有，盜版必究 ， 10/19 頁 10 5) onprogress（下載的時(shí)候周期性的觸發(fā)，可以通過它獲取已經(jīng)下載的文件個(gè)數(shù)和多少文件仍然處于下載隊(duì)列等信息） 6) onupdateready（緩存名單中所有列出的資源被成功重新下載后，新版本的離線網(wǎng)絡(luò)應(yīng)用程序被完整緩存并以備離線使用的標(biāo)志） 7) oncached（離線網(wǎng)絡(luò)應(yīng)用程序被完整緩存成功，可以在離線狀態(tài)下被使用） 8) onobsolete（未找到文件，返回 404 或者 401 時(shí)候觸發(fā)） （ 3）對(duì)更新過程進(jìn)行監(jiān)控和處理各種異常 var appCache = 。error39。 function handleCacheError(e) { alert(39。)?？赡艹霈F(xiàn)的錯(cuò)誤如下： 1) 緩存名單返回一個(gè) HTTP404 錯(cuò)誤（頁面未找到）或者 410 錯(cuò)誤（永久消失） 2) 緩存名單被找到且沒有更改，但指向名單的 HTML 頁面沒有正確下載 3) 緩存名單被找到且被更改，但瀏覽器沒有下載某個(gè)緩存名單中列出的資源 應(yīng)用 updateready 事件自動(dòng)地更新本地緩存 （ 1） updateready 事件的觸發(fā)機(jī)制 如果與頁面綁定的存儲(chǔ)在 Web 服務(wù)器端的 manifest 文件的內(nèi)容發(fā)生變化時(shí)，并且把manifest 文件中所定義的要求更新的各個(gè)資源文件都下載到本地后將引起本地緩存的更新，從而觸發(fā) updateready 事件。 （ 2）如何定義 updateready 事件 當(dāng) Web 頁面加載時(shí)，可以為
教學(xué)課件相關(guān)推薦
鄂ICP備17016276號(hào)-1