CHAPTER 23 OFFLINE APPLICATIONS AND CLIENT-SIDE STORAGE 之 IndexedDB
The Indexed Database API, IndexedDB for short, is a structured data store in the browser. IndexedDB came about as an alternative to the now-deprecated Web SQL Database API (not covered in this book because of its deprecated state). The idea behind IndexedDB was to create an API that easily allowed the storing and retrieval of JavaScript objects while still allowing querying and searching.
翻譯:
索引數(shù)據(jù)庫接口,簡寫IndexedDB,是一個瀏覽器端的結(jié)構(gòu)化數(shù)據(jù)存儲。IndexedDB是Web SQL數(shù)據(jù)庫接口的一個替代方案,這個接口現(xiàn)在已經(jīng)過時(由于已經(jīng)過時,本書不在討論)。IndexedDB的核心想法是創(chuàng)建一個接口,能簡單的對JavaScript對象進(jìn)行存取,同事仍舊可以查詢和檢索。
IndexedDB is designed to be almost completely asynchronous. As a result, most operations are performed as requests that will execute later and produce either a successful result or an error. Nearly every IndexedDB operation requires you to attach onerror and onsuccess event handlers to determine the outcome.
翻譯:
IndexedDB被設(shè)計(jì)成幾乎完全異步。因此,大多數(shù)的操作都會被作為一個請求稍晚執(zhí)行,并且都有可能成功或失敗。幾乎所有的IndexedDB操作都要求綁定錯誤和失敗事件來處理輸出。
Once fully supported, there will be a global indexedDB object that serves as the API host. While the API is still in flux, browsers are using vendor prefixes, so the object in Internet Explorer 10 is called msIndexedDB, in Firefox 4 it’s called mozIndexedDB, and in Chrome it’s called webkitIndexedDB. This section uses indexedDB in the examples for clarity, so you may need to include the following code before each example:
翻譯:
如果完全支持,就會有一個全局的IndexedDB對象。然后由于該接口目前還在討論變動中,各大瀏覽器廠家都使用了開發(fā)商前綴。因此,IE的用msIndexedDB,火狐的用mozIndexedDB,谷歌的用webkitIndexedDB。因此為了使用清晰,使用前需要做下兼容:
var indexedDB = window.indexedDB || window.msIndexedDB || window.mozIndexedDB || window.webkitIndexedDB;
Databases
備注:這一段已經(jīng)過時。方法setVersion和屬性errorCode等等,已經(jīng)不可用。
IndexedDB is a database similar to databases you’ve probably used before such as MySQL or Web SQL Database. The big difference is that IndexedDB uses object stores instead of tables to keep track of data. An IndexedDB database is simply a collection of object stores grouped under a common name.
IndexedDB和你以前使用的MySql等很相似。最大的不同就是IndexedDB使用了對象存儲代替表存儲。一個IndexedDB就是一個分組存儲于一個共同名下的對象的集合。
The first step to using a database is to open it using indexedDB.open() and passing in the name of the database to open. If a database with the given name already exists, then a request is made to open it; if the database doesn’t exist, then a request is made to create and open it. The call to indexDB.open() returns an instance of IDBRequest onto which you can attach onerror and onsuccess event handlers. Here’s an example:
翻譯:
使用數(shù)據(jù)庫的第一步是使用indexedDB.open() 打開它打開它,傳入一個要打開的數(shù)據(jù)庫的名字。假如這個數(shù)據(jù)庫已經(jīng)存在,那么打開它;假如不存在,創(chuàng)建并打開它。調(diào)用indexDB.open()返回一個IDBRequest 的實(shí)例,在這個實(shí)例上面你能綁定錯誤或者成功事件。如下實(shí)例:
var request, database;
request = indexedDB.open(“admin”);
request.onerror = function(event){
alert(“Something bad happened while trying to open: “ + event.target.errorCode);
};
request.onsuccess = function(event){
database = event.target.result;
};
In both event handlers, event.target points to request, so these may be used interchangeably. If the onsuccess event handler is called, then the database instance object (IDBDatabase) is available in event.target.result and stored in the database variable. From this point on, all requests to work with the database are made through the database object itself. If an error occurs, an error code stored in event.target.errorCode indicates the nature of the problem as one of the following (these error codes apply to all operations):
翻譯:
在兩個事件里面,event.target指向該請求,因此他們可以被互換著使用。假如成功事件被調(diào)用,數(shù)據(jù)庫實(shí)例對象(IDBDatabase)在 event.target.result被返回,并被存儲在變量database中。假如錯誤事件被調(diào)用,一個存儲在event.target.errorCode里面的錯誤碼會指明問題所在。所有的錯誤碼如下:
IDBDatabaseException.UNKNOWN_ERR (1) — The error is unexpected and doesn’t fall into an available category.
IDBDatabaseException.NON_TRANSIENT_ERR (2) — The operation is not allowed.
IDBDatabaseException.NOT_FOUND_ERR (3) — The database on which to perform the operation is not found.
IDBDatabaseException.CONSTRAINT_ERR (4) — A database constraint was violated.
IDBDatabaseException.DATA_ERR (5) — Data provided for the transaction doesn’t fulfi ll the requirements.
IDBDatabaseException.NOT_ALLOWED_ERR (6) — The operation is not allowed.
IDBDatabaseException.TRANSACTION_INACTIVE_ERR (7) — An attempt was made to reuse an already completed transaction.
IDBDatabaseException.ABORT_ERR (8) — The request was aborted and so did not succeed.
IDBDatabaseException.READ_ONLY_ERR (9) — Attempt to write or otherwise change data while in read-only mode.
IDBDatabaseException.TIMEOUT_ERR (10) — The operation could not be completed in the amount of time available.
IDBDatabaseException.QUOTA_ERR (11) — Not enough remaining disk space.
By default, a database has no version associated with it, so it’s a good idea to set the initial version when starting out. To do so, call the setVersion() method and pass in the version as a string. Once again, this creates a request object on which you’ll need to assign event handlers:
翻譯:
一個數(shù)據(jù)庫默認(rèn)沒有版本號,因此最好在啟動它的時候給他設(shè)置一個版本號。可以通過調(diào)用方法setVersion(),傳入版本號字符串實(shí)現(xiàn)。再次,該調(diào)用又會創(chuàng)建一個request對象。你需要設(shè)置處理方法。
if (database.version != “1.0”){
request = database.setVersion(“1.0”);
request.onerror = function(event){
alert(“Something bad happened while trying to set version: “ + event.target.errorCode);
};
request.onsuccess = function(event){
alert(“Database initialization complete. Database name: “ + database.name + “, Version: “ + database.version);
};
} else { alert(“Database already initialized. Database name: “ + database.name + “, Version: “ + database.version); }
This example tries to set the version of the database to “1.0”. The first line checks the version property to see if the database version has already been set. If not, then setVersion() is called to create the version change request. If that request is successful, then a message is displayed indicating that the version change is complete. (In a real implementation, this is where you would set up your object stores. See the next section for details.)
翻譯:
上面實(shí)例視圖設(shè)置數(shù)據(jù)庫版本號為1.0。第一行代碼檢測版本號屬性是否已經(jīng)被設(shè)置。假如沒有,那么調(diào)用setVersion()。假如請求成功,成功提示彈出。
If the database version is already “1.0”, then a message is displayed stating that the database has already been initialized. This basic pattern is how you can tell if the database you want to use has already been set up with appropriate object stores or not. Over the course of a web application, you may have many different versions of the database as you update and modify the data structures.
翻譯:
假如版本號已經(jīng)是1.0了。那么會彈出一個已經(jīng)設(shè)置的提示。這是一個判斷數(shù)據(jù)庫是否已經(jīng)滿足你要求的基本套路。隨著頻繁的使用,當(dāng)你更新或修改數(shù)據(jù)庫結(jié)構(gòu)的時候,你可能會有很多數(shù)據(jù)庫版本。