基于移動智能終端的離線緩存技術(shù)研究

王麗娜++孫艷華

摘要：移動互聯(lián)網(wǎng)技術(shù)迅速發(fā)展，移動應(yīng)用開發(fā)備受關(guān)注，但存在問題是移動網(wǎng)絡(luò)的不穩(wěn)定性使用戶斷網(wǎng)后無法訪問應(yīng)用數(shù)據(jù)，論文提出一種基于移動智能終端的離線緩存技術(shù)，應(yīng)用HTML5等終端技術(shù)相結(jié)合智能終端WebView組件技術(shù)在移動終端提出一種新的數(shù)據(jù)存儲機(jī)制，有效解決了移動網(wǎng)絡(luò)不穩(wěn)定造成移動應(yīng)用不可用的問題。

關(guān)鍵詞：移動智能終端；離線緩存；JS服務(wù)接口；跨平臺；HTML5

中圖分類號：TP393 文獻(xiàn)標(biāo)識碼：A 文章編號：1009-3044（2015）33-0027-02

近年來，移動互聯(lián)網(wǎng)技術(shù)迅猛發(fā)展，移動應(yīng)用開發(fā)借助移動互聯(lián)網(wǎng)技術(shù)正處于赤手可熱的階段，很多PC端應(yīng)用已經(jīng)移動智能終端化。智能終端位置不固定，依賴無線網(wǎng)絡(luò)信號，目前移動互聯(lián)網(wǎng)絡(luò)的可靠性不夠強(qiáng)大，造成移動應(yīng)用斷網(wǎng)后無法繼續(xù)訪問數(shù)據(jù)且無法繼續(xù)使用，為解決這一問題，基于移動智能終端離線緩存技術(shù)的研究是有必要的。

在移動智能終端采用基于Web的移動應(yīng)用開發(fā)可解決移動系統(tǒng)的差異性問題，實現(xiàn)跨平臺一次開發(fā)多處安裝。傳統(tǒng)Web離線緩存Cookie技術(shù)存在不足：存儲空間小，費(fèi)流量，存在一定的安全隱患。針對移動智能終端系統(tǒng)及網(wǎng)絡(luò)特點，本文提出一種基于HTML5、JavaScript等終端技術(shù)的移動智能終端離線緩存技術(shù)架構(gòu)，解決移動網(wǎng)絡(luò)不穩(wěn)定情況下用戶能夠繼續(xù)訪問或操作移動應(yīng)用。

1移動智能終端離線緩存技術(shù)分析

1.1 HTML5在線偵測

HTML5技術(shù)推出對于互聯(lián)網(wǎng)Web開發(fā)是一次技術(shù)飛躍，雖然沒有制定統(tǒng)一的標(biāo)準(zhǔn)但已被廣大瀏覽器支持，對于移動互聯(lián)網(wǎng)來說也促進(jìn)了移動應(yīng)用的推陳出新。HTML5技術(shù)突破了移動應(yīng)用必須本地開發(fā)的局限性，其新特性和和跨平臺特點都迎合了移動系統(tǒng)平臺多樣性的需要。HTML5具有在線監(jiān)測網(wǎng)絡(luò)狀態(tài)的新特性，主要是通過navigator.online和online/offline事件進(jìn)行。前者通過返回值true或false得知移動智能終端與服務(wù)器連接狀態(tài)，后者是通過事件觸發(fā)HTML中的標(biāo)簽元素進(jìn)而調(diào)用JavaScript服務(wù)接口，決定遠(yuǎn)程調(diào)用數(shù)據(jù)是否緩存到本地。

在移動智能終端離線緩存技術(shù)架構(gòu)中，要掌握移動智能終端與服務(wù)器的連接狀態(tài)，需實時檢測網(wǎng)絡(luò)狀態(tài)。利用HTML5在線偵測服務(wù)監(jiān)聽online/offline事件，根據(jù)監(jiān)聽結(jié)果觸發(fā)HTML標(biāo)簽進(jìn)而調(diào)用JavaScript服務(wù)調(diào)度接口，簡稱JS接口。若移動APP與服務(wù)器連接良好，則接口請求遠(yuǎn)程數(shù)據(jù)；若與服務(wù)器斷開，則接口調(diào)用數(shù)據(jù)存儲機(jī)制將遠(yuǎn)程數(shù)據(jù)或文件進(jìn)行緩存，且此時用戶的操作請求或更新都會存儲到本地。

1.2 JavaScript接口封裝

在移動應(yīng)用的客戶端開發(fā)過程中Web技術(shù)與本地WebView組件相結(jié)合，使其具有本地應(yīng)用特色給用戶更好地體驗，應(yīng)用與本地組件的交互在本技術(shù)架構(gòu)中通過JS服務(wù)接口實現(xiàn)。采用JavaScript語言實現(xiàn)事件服務(wù)接口封裝，服務(wù)接口是移動平臺本地組件與應(yīng)用服務(wù)器端進(jìn)行數(shù)據(jù)交互的一個中間通道，根據(jù)網(wǎng)絡(luò)檢測狀態(tài)事件調(diào)用JavaScript服務(wù)接口，對遠(yuǎn)程數(shù)據(jù)實現(xiàn)本地存儲與否。圖1為離線緩存技術(shù)架構(gòu)中服務(wù)接口模塊：

若在斷網(wǎng)狀態(tài)下，數(shù)據(jù)有更新操作同樣緩存到本地，網(wǎng)絡(luò)重新建立時更新數(shù)據(jù)會通過接口同步到遠(yuǎn)程應(yīng)用服務(wù)器。

1.3移動智能終端數(shù)據(jù)存儲機(jī)制

HTML5提供了DOM Storage和Web SQL Database兩種存儲機(jī)制，并且提供maninfest屬性以引用cache.manifest文件，該文件聲明了需要本地緩存的所有資源文件或數(shù)據(jù)。針對移動智能終端的特點，若直接采用HTML5緩存技術(shù)離線全部數(shù)據(jù)都存在自帶數(shù)據(jù)庫中，鑒于移動網(wǎng)絡(luò)不夠強(qiáng)大會造成應(yīng)用反應(yīng)遲鈍且耗費(fèi)大量流量，增大用戶負(fù)擔(dān)。在本文提出的離線緩存技術(shù)架構(gòu)中借鑒HTML5緩存技術(shù)設(shè)計了一種適用于移動智能終端的數(shù)據(jù)存儲機(jī)制，把數(shù)據(jù)分為交互數(shù)據(jù)和資源數(shù)據(jù)。

資源數(shù)據(jù)主要包括圖片、CSS文件、JavaScript接口文件等，在移動平臺開發(fā)打包過程中直接將這些文件放到本地。交互數(shù)據(jù)為在用戶操作過程中請求、響應(yīng)的數(shù)據(jù)，將數(shù)據(jù)封裝為JSON格式以文件形式存于本地，需要緩存的數(shù)據(jù)文件都會在manitest文件中記錄。JSON格式化數(shù)據(jù)是一種以（key，value）形式處理輕量級的數(shù)據(jù)交換格式，在數(shù)據(jù)傳輸過程中占用流量少易于存儲，恰好適應(yīng)移動互聯(lián)網(wǎng)及各移動平臺的特點。圖2為移動智能終端數(shù)據(jù)存儲機(jī)制。

2應(yīng)用于移動智能終端的離線緩存技術(shù)實現(xiàn)

2.1移動智能終端離線緩存技術(shù)架構(gòu)

基于移動智能終端離線緩存技術(shù)架構(gòu)如圖3所示，此技術(shù)主要應(yīng)用在網(wǎng)絡(luò)斷開時用戶能夠正常訪問應(yīng)用。在此技術(shù)架構(gòu)中，根據(jù)Mamifest離線緩存文件將基于JS封裝的服務(wù)接口、頁面樣式表、頁面HTML會以文件的形式加載到移動終端本地，其中用戶的每一次請求都會將本地數(shù)據(jù)進(jìn)行更新。遠(yuǎn)程服務(wù)器接口將交互數(shù)據(jù)被封裝為JSON數(shù)據(jù)格式，通過JavaScript接口通道緩存到移動應(yīng)用本地存儲空間中。HTML5在線監(jiān)聽網(wǎng)絡(luò)狀態(tài)，監(jiān)聽到offline事件后，此時用戶發(fā)起請求Web頁面做出響應(yīng)，頁面展示數(shù)據(jù)將從本地緩存文件或數(shù)據(jù)庫中讀取。在此過程中HTML頁面基于WebView組件展示，Web頁面與本地數(shù)據(jù)進(jìn)行交互，符合本地移動應(yīng)用響應(yīng)快的特點，滿足用戶的體驗要求。

在本技術(shù)架構(gòu)中，離線狀態(tài)下若用戶有數(shù)據(jù)需上傳同樣通過JavaScript接口將數(shù)據(jù)封裝為JSON數(shù)據(jù)格式，首先由移動智能終端獲取并保存至本地以文本文件格式保存至本地。此時數(shù)據(jù)在文本文檔中被封裝為JSON數(shù)據(jù)格式串，如此WebView組件中不必處理與本地數(shù)據(jù)庫之間的復(fù)雜數(shù)據(jù)處理邏輯，在聯(lián)網(wǎng)時文件中的數(shù)據(jù)將自動提交至遠(yuǎn)程服務(wù)器。

3總結(jié)

本文在傳統(tǒng)離線緩存技術(shù)的基礎(chǔ)上提出了基于移動智能終端的離線緩存技術(shù)，傳統(tǒng)Web技術(shù)與移動開發(fā)技術(shù)相結(jié)合，WebView控件加載HTML網(wǎng)頁，滿足當(dāng)前移動互聯(lián)網(wǎng)技術(shù)的發(fā)展同時也克服傳統(tǒng)離線存儲的局限性，在移動網(wǎng)絡(luò)不穩(wěn)定的情況下，為移動應(yīng)用提供一種有效的離線緩存方法。

參考文獻(xiàn)：

[1] 黃永慧，陳程凱. HTML5在移動應(yīng)用開發(fā)上的應(yīng)用前景[J].計算機(jī)技術(shù)與發(fā)展，2013，23（7）：207-210.

[2] 鄭艷.HTML5本地存儲和離線緩存機(jī)制應(yīng)用研究[D].武漢：武漢理工大學(xué)，2014：4-13.

[3] 劉宇.基于跨平臺的移動應(yīng)用開發(fā)框架研究[D].北京：北京交通大學(xué)，2014：4-16.

[4] 楊安寧， 周瑩， 呂康.一種Android平臺GIS軟件的新型數(shù)據(jù)緩存策略的實現(xiàn)[J].計算機(jī)與現(xiàn)代化，2012（10）：46-49.

[5] 王明超.基于腳本的客戶端軟件結(jié)構(gòu)化存儲技術(shù)研究[J].計算機(jī)技術(shù)與發(fā)展，2010，20（2）：25-28.

[6] 吳廣才，鄭杰生.HTML5技術(shù)在移動管理駕駛艙中的應(yīng)用[J].現(xiàn)代計算機(jī)，2014（1）：60-63.

[7] 劉斌.HTML5——未來網(wǎng)絡(luò)應(yīng)用的核心技術(shù)研究[J].自動化與儀表，2010（4）：30-33.

[8] 張玉晴，黃瑾娉.基于HTML5的跨平臺移動應(yīng)用關(guān)鍵技術(shù)的研究與實現(xiàn)[J].工業(yè)控制計算機(jī)，2013（3）：56-58.