背景：HTML5的出現(xiàn)，新增了很多功能，比如WebSQL、頁(yè)面緩存等。這對(duì)于離線訪問(wèn)頁(yè)面以及將部分?jǐn)?shù)據(jù)存儲(chǔ)到本地，提供了很大的便利。
目的：實(shí)現(xiàn)離線打開(kāi)表單，填寫后暫存本地，聯(lián)網(wǎng)后同步到服務(wù)器。并且實(shí)現(xiàn)Android、iOS、瀏覽器都能共用代碼的開(kāi)發(fā)模式。
解決：以android為例。
將資源文件放在assets里面，然后用Webview加載本地資源（HTML等），最大的問(wèn)題在于瀏覽器的同源策略。解決方法是，充分實(shí)現(xiàn)java和JS的交互，從而使得所有的網(wǎng)絡(luò)請(qǐng)求不通過(guò)Webview，而是原生API，大致可以參考這篇文章：
http://www.cnblogs.com/cherrylv/p/6424199.html
還一個(gè)好處是，這也免去了原生與Webview之間傳遞cookie的麻煩。

但是，也有很多坑等著我們。
1- 如果數(shù)據(jù)交互比較多，那么這樣寫就反而變得十分麻煩。并不僅僅是表單，還有事件排序啊之類的。HTML內(nèi)部鏈接比較多時(shí)，轉(zhuǎn)接也比較麻煩。難以預(yù)測(cè)今后有哪些功能需要擴(kuò)展，給未來(lái)挖坑，不是明智的選擇。
2- HTML文件并不能直接被瀏覽器直接利用，必須修改掉與java交互的代碼。維護(hù)兩份近似的代碼，其實(shí)也是一種麻煩。雖然合理安排或者模塊化還是能較好地維護(hù)。
3- Webview名存實(shí)亡，只是一個(gè)HTML解析工具。
4- Webview本身就比較慢，不如原生。
5- 如果想重用HTML，可能需要在java里面使用后端模板引擎，反而麻煩。
6-WebSQL和IndexDB用起來(lái)不如okhttp之類的方便。
7- 潛在的無(wú)數(shù)的坑。

最終決策：對(duì)于這種需求的軟件，盡量采用原生APP的寫法。而對(duì)于不需要離線存儲(chǔ)的軟件，可以考慮混編。
對(duì)于老板的軟件，暫時(shí)采用原生APP的形式，如果需要通過(guò)iOS或者電腦使用，那么就再寫個(gè)web端，但是不支持離線存儲(chǔ)。iOS混編時(shí)應(yīng)采用一個(gè)Webview的形式，免得麻煩。干干凈凈地寫代碼才是王道。

總結(jié)

以上是生活随笔為你收集整理的Hybrid APP的离线存储总结的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。