日韩无码专区无码一级三级片|91人人爱网站中日韩无码电影|厨房大战丰满熟妇|AV高清无码在线免费观看|另类AV日韩少妇熟女|中文日本大黄一级黄色片|色情在线视频免费|亚洲成人特黄a片|黄片wwwav色图欧美|欧亚乱色一区二区三区

RELATEED CONSULTING
相關(guān)咨詢
選擇下列產(chǎn)品馬上在線溝通
服務(wù)時(shí)間：8:30-17:00
你可能遇到了下面的問題
關(guān)閉右側(cè)工具欄

新聞中心

這里有您想知道的互聯(lián)網(wǎng)營銷解決方案
如何解決IndexedDB在webkit內(nèi)核下新舊版本的兼容問題

這篇文章會(huì)接著介紹IndexedDB(以下簡稱IDB)。我們會(huì)介紹如何解決在webkit內(nèi)核下、新舊版本規(guī)范的兼容問題。

目前支持IDB的webkit內(nèi)核瀏覽器有chrome和傲游3，safari暫不支持IDB。

首先，由于內(nèi)核不同，所以window.indexedDB被改為了帶有webkit前綴的變量window.webkitIndexedDB。同時(shí)發(fā)生變化的還有兩個(gè)對象IDBKeyRange和IDBTransaction。如果想兼容gecko和webkit內(nèi)核，那么可以在程序的開頭加入如下代碼：

 
 
 
    
  
  
  
  1. if ('webkitIndexedDB' in window) {  
    2.   
  
  
  2.     window.indexedDB = webkitIndexedDB;  
    3.   
  
  
  3.     window.IDBKeyRange = webkitIDBKeyRange;  
    4.   
  
  
  4.     windowwindow.IDBTransaction = window.webkitIDBTransaction;  
    5.   
  
  
  5. }  
    6.   
  
  
  6. else if ('mozIndexedDB' in window) {  
    7.   
  
  
  7.     window.indexedDB = mozIndexedDB;  
    8.   
  
  
  8. } 
    9.

其次，webkit內(nèi)核(chrome17或傲游3.3)和Firefox9及其更舊的版本遵循的IDB規(guī)范已經(jīng)是舊版本的規(guī)范了，而Firefox10已經(jīng)遵循的是新版本IDB規(guī)范。兩者的主要區(qū)別在于版本控制的方式不同。舊版中的版本變更方式是：

 
 
 
    
  
  
  
  1. var req = window.indexedDB.open(dbName); // 舊版在這里不需要寫明dbVersion  
    2.   
  
  
  2. req.onsuccess = function (e) {  
    3.   
  
  
  3.     var db = this.result;  
    4.   
  
  
  4.     if (db.version != '1.0') {  
    5.   
  
  
  5.         var subReq = db.setVersion('1.0'); // 通過setVersion修改版本號，而不是onupgradeneeded事件  
    6.   
  
  
  6.         subReq.onsuccess = function (e) {  
    7.   
  
  
  7.             // TODO: real success code  
    8.   
  
  
  8.         };  
    9.   
  
  
  9.     }  
    10.   
  
  
  10.     else {  
    11.   
  
  
  11.         // TODO: real success code  
    12.   
  
  
  12.     }  
    13.   
  
  
  13. }; 
    14.

除了上述的兩點(diǎn)不同，新舊兩版的接口設(shè)計(jì)基本上是相同的。

規(guī)范的頻繁變更確實(shí)不是我們希望看到的，在IDB尚未被廣泛應(yīng)用時(shí)做出改變，或許影響面還不算太大。但如果我們希望通過一套代碼兼容新舊兩版規(guī)范，還是有辦法的。

 
 
 
    
  
  
  
  1. var req = window.indexedDB.open(dbName, dbVersion); // 對于舊版而言，會(huì)忽略第二個(gè)參數(shù)，因此這里可以兼容  
    2.   
  
  
  2. req.onsuccess = function (e) {  
    3.   
  
  
  3.     var db = this.result;  
    4.   
  
  
  4.     if (db.version != dbVersion) { // 新版中兩者絕對一致，否則只會(huì)觸發(fā)onupgradeneeded事件，因此這里也可以兼容  
    5.   
  
  
  5.         // TODO: code of changing object stores for new version  
    6.   
  
  
  6.         var subReq = db.setVersion(dbVersion);  
    7.   
  
  
  7.         subReq.onsuccess = function (e) {  
    8.   
  
  
  8.             // TODO: real success code  
    9.   
  
  
  9.         };  
    10.   
  
  
  10.     }  
    11.   
  
  
  11.     else {  
    12.   
  
  
  12.         // TODO: real success code  
    13.   
  
  
  13.     }  
    14.   
  
  
  14. };  
    15.   
  
  
  15. req.onupgradeneeded = function (e) {  
    16.   
  
  
  16.     // TODO: code of changing object stores for new version  
    17.   
  
  
  17. }; 
    18.

---------------- 兼容IE的分割線 ---------------

這里額外插入一段如何兼容IE10的說明，IE10***的預(yù)覽版也已經(jīng)支持了IndexedDB，和window.webkitIndexedDB和window.mozIndexedDB類似，IE10中對應(yīng)的變量名為window.msIndexedDB，所以，相兼容IE，把上面***部分的代碼改為：

 
 
 
    
  
  
  
  1. if ('webkitIndexedDB' in window) {  
    2.   
  
  
  2.     window.indexedDB = webkitIndexedDB;  
    3.   
  
  
  3.     window.IDBKeyRange = webkitIDBKeyRange;  
    4.   
  
  
  4.     windowwindow.IDBTransaction = window.webkitIDBTransaction;  
    5.   
  
  
  5. }  
    6.   
  
  
  6. else if ('mozIndexedDB' in window) {  
    7.   
  
  
  7.     window.indexedDB = mozIndexedDB;  
    8.   
  
  
  8. }  
    9.   
  
  
  9. else if ('msIndexedDB' in window) {  
    10.   
  
  
  10.     window.indexedDB = msIndexedDB;  
    11.   
  
  
  11. } 
    12.

即可。下面的“全兼容”的例子已經(jīng)用到了這段代碼。

---------------- 兼容IE的分割線 ---------------

這樣，我們就完成了不同內(nèi)核不同版本下的“全兼容”。

還記得上一篇文章中的demo嗎?我通過上面的兼容方法，對這個(gè)例子做了進(jìn)一步的兼容性處理和接口封裝，得到了另一個(gè)demo：

DEMO演示鏈接 (firefox/chrome/maxthon)

至此，IndexedDB技術(shù)介紹告一段落。我們先后介紹了基本原理、接口定義、并通過一個(gè)簡單的例子，進(jìn)行了gecko/webkit內(nèi)核下的新舊規(guī)范的兼容和適配，希望諸位看過之后有所收獲。IndexedDB的用途和用法還有很多，在此不一一列舉，大家可以在W3C的官方文檔中繼續(xù)研究和探索。

【系列文章】

  1. IndexedDB的JS接口設(shè)計(jì)詳解
  2. 淺析IndexedDB存數(shù)結(jié)構(gòu)
  3. 調(diào)試IndexedDB應(yīng)用程序
  4. 基于Firefox 10的IndexedDB實(shí)例演示

原文：http://bulaoge.net/user.blg?dmn=g3g4&cid=90094


網(wǎng)站標(biāo)題：如何解決IndexedDB在webkit內(nèi)核下新舊版本的兼容問題
文章源于：http://m.5511xx.com/article/dhhjdsd.html