目前很多瀏覽器端據(jù)存儲(chǔ)方案都不適合存儲(chǔ)大量數(shù)據(jù),例如Cookies容量不超過(guò)4KB,且每次請(qǐng)求都會(huì)發(fā)送回服務(wù)器lallorse容量在2.5~I0MB之間,且需要以學(xué)符申形式進(jìn)行存儲(chǔ)。為此,瀏覽器端的數(shù)據(jù)存儲(chǔ)需要種新的技術(shù)方案,IndexedDB應(yīng)運(yùn)而生。
在了解IndexedDB之前,首先了解以下兩種不同類(lèi)型的數(shù)據(jù)庫(kù):關(guān)系型和文檔型(也稱(chēng)為NoSQL或?qū)ο?。
關(guān)系型數(shù)據(jù)庫(kù):如SQLServer.MySQL.Oracle,此類(lèi)數(shù)據(jù)庫(kù)將數(shù)據(jù)存儲(chǔ)在表中。
文檔型數(shù)據(jù)庫(kù):如MongoDB、CouchDB、Redis,此類(lèi)數(shù)據(jù)庫(kù)將數(shù)據(jù)集作為個(gè)體對(duì)象存儲(chǔ)。
IndexedDB是HTML5提供的內(nèi)置于瀏覽器中的數(shù)據(jù)庫(kù),它可以通過(guò)網(wǎng)頁(yè)腳本程序創(chuàng)建和操作。IndexedDB允許儲(chǔ)存大量數(shù)據(jù),并且提供查詢(xún)接口建立索引的功能。就數(shù)據(jù)庫(kù)類(lèi)型而言,IndexedDB不屬于關(guān)系型數(shù)據(jù)庫(kù)(不支持SQL查詢(xún)語(yǔ)句),更接近文檔型數(shù)據(jù)庫(kù)。IndexedDB具備以下幾個(gè)特點(diǎn):
(1)鍵值對(duì)儲(chǔ)存
IndexedDB內(nèi)部采用對(duì)象倉(cāng)庫(kù)(ObjectStore)存放數(shù)據(jù),所有類(lèi)型的數(shù)據(jù)都可以直接存入包括JavaScript對(duì)象。在對(duì)象倉(cāng)庫(kù)中,數(shù)據(jù)以“鍵值對(duì)”的形式保存,每一個(gè)數(shù)據(jù)都有對(duì)應(yīng)的鍵名且鍵名必須是唯一的,否則會(huì)拋出錯(cuò)誤。
(2)異步API
IndexedDB數(shù)據(jù)庫(kù)在執(zhí)行增、刪、改、查操作時(shí)不會(huì)鎖死瀏覽器,用戶(hù)依然可以進(jìn)行其他操作。與localStorage的同步設(shè)計(jì)相比,IndexedDB的異步設(shè)計(jì)可以防止大量數(shù)據(jù)讀寫(xiě)時(shí)拖慢網(wǎng)頁(yè)加載速度,而影響用戶(hù)的網(wǎng)站體驗(yàn)。
(3)支持事務(wù)
事務(wù)的概念在關(guān)系型數(shù)據(jù)庫(kù)中應(yīng)用比較廣泛,這里讀者只需要簡(jiǎn)單理解它的作用即可。舉個(gè)例子,一次操作需要在一 個(gè)數(shù)據(jù)表中同時(shí)插入兩條數(shù)據(jù),第1條數(shù)據(jù)插入成功,第2條數(shù)據(jù)插入失敗。那么,對(duì)于整個(gè)操作來(lái)說(shuō),兩條數(shù)據(jù)都插入成功才算成功,失敗時(shí)便需要事務(wù)的回滾,將已經(jīng)插入的第1條數(shù)據(jù)清除。
IndexedDB支持事務(wù)意味著在一系列操作步驟之中,只要有 一步失敗,整個(gè)事務(wù)就都取消,數(shù)據(jù)庫(kù)回到事務(wù)發(fā)生之前的狀態(tài),不存在只改寫(xiě)一部分?jǐn)?shù)據(jù)的情況。
在IndexedDB中,事務(wù)會(huì)自動(dòng)提交或回滾。當(dāng)請(qǐng)求一個(gè)事務(wù)時(shí),必須指定事務(wù)的請(qǐng)求訪問(wèn)模式。
(4)同域限制
IndexedDB也受到同域限制,每-一個(gè)數(shù)據(jù)庫(kù)對(duì)應(yīng)創(chuàng)建該數(shù)據(jù)庫(kù)的域名,來(lái)自不同域名的網(wǎng)頁(yè)只能訪問(wèn)自身域名下的數(shù)據(jù)庫(kù),而不能訪問(wèn)其他域名下的數(shù)據(jù)庫(kù)。
(5)存儲(chǔ)空間大
IndexedDB的存儲(chǔ)空間比localStorage大得多,一般來(lái)說(shuō)不少于250MB。不同瀏覽器的限制不同,IE的儲(chǔ)存上限是250MB,Chrome和Opera瀏覽器的存儲(chǔ)上限是硬盤(pán)剩余空間的某個(gè)百分比,Firefox瀏覽器則沒(méi)有上限。
(6)支持二進(jìn)制儲(chǔ)存
前8Cbexebnl1.8.If
IndexedDB不僅可以?xún)?chǔ)存字符串,還可以?xún)?chǔ)存二進(jìn)制數(shù)據(jù)。
根據(jù)上述特點(diǎn),IndexedDB適用于以下場(chǎng)景:
●用戶(hù)通過(guò)瀏覽器訪問(wèn)應(yīng)用程序。
開(kāi)發(fā)人員需要在客戶(hù)端存儲(chǔ)大量的數(shù)據(jù)。
●開(kāi)發(fā)人員需要在一個(gè)大型的數(shù)據(jù)集合中快速定位單個(gè)數(shù)據(jù)點(diǎn)。
●客戶(hù)端數(shù)據(jù)存儲(chǔ)需要事務(wù)支持。
瀏覽器的更新速度較快,因此關(guān)于瀏覽器對(duì)IndexedDB的支持,讀者可以到http:// caniuse. com/ # search= indexdb這個(gè)網(wǎng)址查看最新的支持情況。編寫(xiě)本書(shū)時(shí),該網(wǎng)址的頁(yè)面效果如圖11-17所示。
猜你喜歡:
怎樣使用select控件制作下拉菜單效果?
移動(dòng)端touch事件解析判斷拖動(dòng)方向
前端與移動(dòng)開(kāi)發(fā):Js中調(diào)試小技巧tips---斷點(diǎn)調(diào)試
什么是服務(wù)器端渲染?它有哪些優(yōu)點(diǎn)和不足?
傳智教育web前端與移動(dòng)開(kāi)發(fā)培訓(xùn)