PhoneGap API介绍:Storage

移动开发
本文将介绍PhoneGap API——Storage:截获设备的本地存储选项。Storage提供对设备的存储选项的访问。此API基于W3C WEB SQL Database Specification和W3C Web Storage API Specification。有些设备已经提供了对该规范的实现,对于这些设备采用内置实现而非使用PhoneGap的实现。对于没有存储支持的设备,PhoneGap的实现应该是完全兼容W3C规范。

方法

参数

对象:

 openDatabase

  • 返回一个新的Database对象。
  1. var dbShell = window.openDatabase(name, version, display_name, size); 

说明

  • window.openDatabase返回一个新的Database对象。
  • 该方法将创建一个新的SQL Lite数据库,并返回该Database对象。可使用该Database对象操作数据。

支持的平台

  • Android
  • BlackBerry WebWorks (OS 6.0或更高版本)
  • iPhone

简单的范例

  1. var db = window.openDatabase("test""1.0""Test DB", 1000000); 

完整的范例

  1. <!DOCTYPE html> 
  2. <html> 
  3. <head>     
  4. <title>Contact Example</title> 
  5.  
  6. <script type="text/javascript" charset="utf-8" src="phonegap.js"></script> 
  7. <script type="text/javascript" charset="utf-8"> 
  8.  
  9. // 等待加载PhoneGap 
  10. document.addEventListener("deviceready", onDeviceReady, false); 
  11.  
  12. // PhoneGap加载完毕 
  13. function onDeviceReady() { 
  14.     var db = window.openDatabase("test", "1.0", "Test DB", 1000000); 
  15.  
  16. </script> 
  17. </head> 
  18. <body> 
  19.     <h1>Example</h1> 
  20.     <p>Open Database</p> 
  21. </body> 
  22. </html> 

name
数据库的名称。
version

  • 数据库的版本号。

display_name

  • 数据库的显示名。

size

  • 以字节为单位的数据库大小。

Database

  • 包含允许用户操作数据库的方法。

方法

  • transaction:运行一个数据库事务。
  • changeVersion:该方法允许脚本执行以下原子操作:校验数据库的版本号并更新版本号以完成架构更新。

详述

  • 调用window.openDatabase()将返回一个Database对象。

支持的平台

  • Android
  • BlackBerry WebWorks (OS 6.0或更高版本)
  • iPhone

Transaction 的简单范例

  1. function populateDB(tx) { 
  2.     tx.executeSql('DROP TABLE DEMO IF EXISTS'); 
  3.     tx.executeSql('CREATE TABLE IF NOT EXISTS DEMO (id unique, data)'); 
  4.     tx.executeSql('INSERT INTO DEMO (id, data) VALUES (1, "First row")'); 
  5.     tx.executeSql('INSERT INTO DEMO (id, data) VALUES (2, "Second row")'); 
  6.  
  7. function errorCB(err) { 
  8.        alert("Error processing SQL: "+err.code); 
  9.  
  10. function successCB() { 
  11.        alert("success!"); 
  12.  
  13. var db = window.openDatabase("Database""1.0""PhoneGap Demo", 200000); 
  14. db.transaction(populateDB, errorCB, successCB); 
  15. Change Version的简单范例: 
  16.  
  17. var db = window.openDatabase("Database""1.0""PhoneGap Demo", 200000); 
  18. db.changeVersion("1.0""1.1"); 

完整的范例

  1. <!DOCTYPE html> 
  2. <html> 
  3. <head>     
  4. <title>Contact Example</title> 
  5.  
  6. <script type="text/javascript" charset="utf-8" src="phonegap.js"></script> 
  7. <script type="text/javascript" charset="utf-8"> 
  8.  
  9.     // 等待加载PhoneGap 
  10.     document.addEventListener("deviceready", onDeviceReady, false); 
  11.      
  12.     // PhoneGap加载完毕 
  13.     function onDeviceReady() { 
  14.         var db = window.openDatabase("Database", "1.0", "PhoneGap Demo", 200000); 
  15.         db.transaction(populateDB, errorCB, successCB); 
  16.     } 
  17.      
  18.     // 填充数据库 
  19.     function populateDB(tx) { 
  20.         tx.executeSql('DROP TABLE DEMO IF EXISTS'); 
  21.         tx.executeSql('CREATE TABLE IF NOT EXISTS DEMO (id unique, data)'); 
  22.         tx.executeSql('INSERT INTO DEMO (id, data) VALUES (1, "First row")'); 
  23.         tx.executeSql('INSERT INTO DEMO (id, data) VALUES (2, "Second row")'); 
  24.     } 
  25.      
  26.     // 事务执行出错后调用的回调函数 
  27.     function errorCB(tx, err) { 
  28.         alert("Error processing SQL: "+err); 
  29.     } 
  30.      
  31.     // 事务执行成功后调用的回调函数 
  32.     function successCB() { 
  33.         alert("success!"); 
  34.     } 
  35.  
  36. </script> 
  37. </head> 
  38. <body> 
  39.     <h1>Example</h1> 
  40.     <p>Database</p> 
  41. </body> 
  42. </html> 

Android 1.X 的特异情况

  • changeVersion:Android 1.X设备不支持此方法。

SQLTransaction

  • 包含允许用户对Database对象执行SQL语句的方法。

方法

  • executeSql:执行一条SQL语句。

详述

  • 当你调用Database对象的transaction方法后,其回调函数将被调用并接收一个SQLTransaction对象。用户可以通过多次调用executeSql来建立一个数据库事务处理。

支持的平台

  • Android
  • BlackBerry WebWorks (OS 6.0或更高版本)
  • iPhone

Execute SQL的简单范例

  1. function populateDB(tx) { 
  2.     tx.executeSql('DROP TABLE DEMO IF EXISTS'); 
  3.     tx.executeSql('CREATE TABLE IF NOT EXISTS DEMO (id unique, data)'); 
  4.     tx.executeSql('INSERT INTO DEMO (id, data) VALUES (1, "First row")'); 
  5.     tx.executeSql('INSERT INTO DEMO (id, data) VALUES (2, "Second row")'); 
  6.  
  7. function errorCB(err) { 
  8.        alert("Error processing SQL: "+err); 
  9.  
  10. function successCB() { 
  11.        alert("success!"); 
  12.  
  13. var db = window.openDatabase("Database""1.0""PhoneGap Demo", 200000); 
  14. db.transaction(populateDB, errorCB, successCB); 

完整的范例

  1. <!DOCTYPE html> 
  2. <html> 
  3. <head>     
  4. <title>Contact Example</title> 
  5.  
  6. <script type="text/javascript" charset="utf-8" src="phonegap.js"></script> 
  7. <script type="text/javascript" charset="utf-8"> 
  8.  
  9. // 等待加载PhoneGap 
  10. document.addEventListener("deviceready", onDeviceReady, false); 
  11.  
  12. // PhoneGap加载完毕 
  13. function onDeviceReady() { 
  14.        var db = window.openDatabase("Database", "1.0", "PhoneGap Demo", 200000); 
  15.        db.transaction(populateDB, errorCB, successCB); 
  16.  
  17. // 填充数据库 
  18. function populateDB(tx) { 
  19.     tx.executeSql('DROP TABLE DEMO IF EXISTS'); 
  20.     tx.executeSql('CREATE TABLE IF NOT EXISTS DEMO (id unique, data)'); 
  21.     tx.executeSql('INSERT INTO DEMO (id, data) VALUES (1, "First row")'); 
  22.     tx.executeSql('INSERT INTO DEMO (id, data) VALUES (2, "Second row")'); 
  23.  
  24. // 事务执行出错后调用的回调函数 
  25. function errorCB(err) { 
  26.        alert("Error processing SQL: "+err); 
  27.  
  28. // 事务执行成功后调用的回调函数 
  29. function successCB() { 
  30.        alert("success!"); 
  31.  
  32. </script> 
  33. </head> 
  34. <body> 
  35.     <h1>Example</h1> 
  36.     <p>SQLTransaction</p> 
  37. </body> 
  38. </html> 

SQLResultSet

  • 当SQLTransaction对象的executeSql方法被调用,将会触发executeSql中设定的回调函数并返回一个SQLResultSet对象。

属性

  • insertId:SQLResultSet对象通过SQL语句插入到数据库的行记录的行ID。[译注:如果插入多行的时候,返回***一个行的ID]
  • rowAffected:被SQL语句改变的记录行数,如果语句没有影响任何行则设置为0。
  • rows:是一个SQLResultSetRowList对象,表示返回的多条记录。如果没有返回任何记录,则此对象为空。

详述

  • 当你调用SQLTransaction对象的executeSql方法,将会触发executeSql中设定的回调函数并返回一个SQLResultSet对象。该结果对象包含三个属性:***个是insertID返回成功的SQL插入语句所插入行的ID,如果SQL语句不是插入语句则insertID将不被设定;第二个是rowAffected,在SQL查询操作时此属性总是0,当插入或更新操作时此属性返回受到影响的行数;***一个属性是SQLResultSetList类型,返回SQL查询语句的返回数据。

支持的平台

  • Android
  • BlackBerry WebWorks (OS 6.0或更高版本)
  • iPhone

Execute SQL的简单范例

  1. function queryDB(tx) { 
  2.     tx.executeSql('SELECT * FROM DEMO', [], querySuccess, errorCB); 
  3.  
  4. function querySuccess(tx, results) { 
  5.     // 因为没有插入记录,所以返回值为空 
  6.     console.log("Insert ID = " + results.insertId); 
  7.     // 因为这是一条查询语句所以返回值为0 
  8.     console.log("Rows Affected = " + results.rowAffected); 
  9.     // 返回查询到的记录行数量 
  10.     console.log("Insert ID = " + results.rows.length); 
  11.  
  12. function errorCB(err) { 
  13.     alert("Error processing SQL: "+err.code); 
  14.  
  15. var db = window.openDatabase("Database""1.0""PhoneGap Demo", 200000); 
  16. db.transaction(queryDB, errorCB); 

完整的范例

  1. <!DOCTYPE html> 
  2. <html> 
  3. <head>     
  4. <title>Contact Example</title> 
  5.  
  6. <script type="text/javascript" charset="utf-8" src="phonegap.js"></script> 
  7. <script type="text/javascript" charset="utf-8"> 
  8.  
  9.     // 等待加载PhoneGap 
  10.     document.addEventListener("deviceready", onDeviceReady, false); 
  11.      
  12.     // 填充数据库 
  13.     function populateDB(tx) { 
  14.         tx.executeSql('DROP TABLE DEMO IF EXISTS'); 
  15.         tx.executeSql('CREATE TABLE IF NOT EXISTS DEMO (id unique, data)'); 
  16.         tx.executeSql('INSERT INTO DEMO (id, data) VALUES (1, "First row")'); 
  17.         tx.executeSql('INSERT INTO DEMO (id, data) VALUES (2, "Second row")'); 
  18.     } 
  19.      
  20.     // 查询数据库 
  21.     function queryDB(tx) { 
  22.         tx.executeSql('SELECT * FROM DEMO', [], querySuccess, errorCB); 
  23.     } 
  24.      
  25.     // 查询成功后调用的回调函数 
  26.     function querySuccess(tx, results) { 
  27.         // 因为没有插入记录,所以返回值为空 
  28.         console.log("Insert ID = " + results.insertId); 
  29.         // 因为这是一条查询语句所以返回值为0 
  30.         console.log("Rows Affected = " + results.rowAffected); 
  31.         // 返回查询到的记录行数量 
  32.         console.log("Insert ID = " + results.rows.length); 
  33.     } 
  34.      
  35.     // 事务执行出错后调用的回调函数 
  36.     function errorCB(err) { 
  37.         console.log("Error processing SQL: "+err.code); 
  38.     } 
  39.      
  40.     // 事务执行成功后调用的回调函数 
  41.     function successCB() { 
  42.         var db = window.openDatabase("Database", "1.0", "PhoneGap Demo", 200000); 
  43.         db.transaction(queryDB, errorCB); 
  44.     } 
  45.      
  46.     // PhoneGap加载完毕 
  47.     function onDeviceReady() { 
  48.         var db = window.openDatabase("Database", "1.0", "PhoneGap Demo", 200000); 
  49.         db.transaction(populateDB, errorCB, successCB); 
  50.     } 
  51.  
  52. </script> 
  53. </head> 
  54. <body> 
  55.     <h1>Example</h1> 
  56.     <p>Database</p> 
  57. </body> 
  58. </html> 

SQLResultSetList

  • SQLResultSet对象的一个属性,包含SQL查询所返回的所有行数据。

属性

  • length: SQL查询所返回的记录行数。

方法

  • item:根据指定索引返回一个行记录的JavaScript对象。

详述

  • SQlResultSetList包含一个SQL查询语句所返回的数据。该对象包含一个长度属性告知用户有多少符合查询条件的行记录数被返回。通过传递指定的索引给该对象的item方法获取指定的行记录数据,此item方法返回一个JavaScript对象,其属性包含前述查询语句所针对的数据库的所有列。

支持的平台

  • Android
  • BlackBerry WebWorks (OS BlackBerry WebWorks (OS 6.0或更高版本)
  • iPhone

Execute SQL的简单范例

  1. function queryDB(tx) { 
  2.        tx.executeSql('SELECT * FROM DEMO', [], querySuccess, errorCB); 
  3.  
  4. function querySuccess(tx, results) { 
  5.        var len = results.rows.length; 
  6.        console.log("DEMO table: " + len + " rows found."); 
  7.        for (var i=0; i<len; i++){ 
  8.            console.log("Row = " + i + " ID = " + results.rows.item(i).id + " Data =  " + results.rows.item(i).data); 
  9.        } 
  10.  
  11. function errorCB(err) { 
  12.        alert("Error processing SQL: "+err.code); 
  13.  
  14. var db = window.openDatabase("Database""1.0""PhoneGap Demo", 200000); 
  15. db.transaction(queryDB, errorCB); 

完整的范例

  1. <!DOCTYPE html> 
  2. <html> 
  3. <head>     
  4. <title>Contact Example</title> 
  5.  
  6. <script type="text/javascript" charset="utf-8" src="phonegap.js"></script> 
  7. <script type="text/javascript" charset="utf-8"> 
  8.  
  9.     // 等待加载PhoneGap 
  10.     document.addEventListener("deviceready", onDeviceReady, false); 
  11.      
  12.     // 填充数据库 
  13.     function populateDB(tx) { 
  14.         tx.executeSql('DROP TABLE DEMO IF EXISTS'); 
  15.         tx.executeSql('CREATE TABLE IF NOT EXISTS DEMO (id unique, data)'); 
  16.         tx.executeSql('INSERT INTO DEMO (id, data) VALUES (1, "First row")'); 
  17.         tx.executeSql('INSERT INTO DEMO (id, data) VALUES (2, "Second row")'); 
  18.     } 
  19.      
  20.     // 查询数据库 
  21.     function queryDB(tx) { 
  22.         tx.executeSql('SELECT * FROM DEMO', [], querySuccess, errorCB); 
  23.     } 
  24.      
  25.     // 查询成功后调用的回调函数 
  26.     function querySuccess(tx, results) { 
  27.         var len = results.rows.length; 
  28.         console.log("DEMO table: " + len + " rows found."); 
  29.         for (var i=0; i<len; i++){ 
  30.             console.log("Row = " + i + " ID = " + results.rows.item(i).id + " Data =  " + results.rows.item(i).data); 
  31.         } 
  32.     } 
  33.      
  34.     // 事务执行出错后调用的回调函数 
  35.     function errorCB(err) { 
  36.         console.log("Error processing SQL: "+err.code); 
  37.     } 
  38.      
  39.     // 事务执行成功后调用的回调函数 
  40.     function successCB() { 
  41.         var db = window.openDatabase("Database", "1.0", "PhoneGap Demo", 200000); 
  42.         db.transaction(queryDB, errorCB); 
  43.     } 
  44.      
  45.     // PhoneGap加载完毕 
  46.     function onDeviceReady() { 
  47.         var db = window.openDatabase("Database", "1.0", "PhoneGap Demo", 200000); 
  48.         db.transaction(populateDB, errorCB, successCB); 
  49.     } 
  50.  
  51. </script> 
  52. </head> 
  53. <body> 
  54.     <h1>Example</h1> 
  55.     <p>Database</p> 
  56. </body> 
  57. </html> 

SQLError

  • 出现错误时,将抛出一个SQLError对象。

属性

  • code: 一个在下面常量列表中定义好的错误代码c。
  • message:关于此错误的说明。

常量

  • SQLError.UNKNOWN_ERR:未知错误
  • SQLError.DATABASE_ERR:数据库错误
  • SQLError.VERSION_ERR:版本错误
  • SQLError.TOO_LARGE_ERR:数据集过大错误
  • SQLError.QUOTA_ERR:超过数据库配额错误
  • SQLError.SYNTAX_ERR:语法错误
  • SQLError.CONSTRAINT_ERR:约束错误
  • SQLError.TIMEOUT_ERR:超时错误

说明

  • 操作数据库出现错误时,将抛出一个SQLError对象。

localStorage

  • 提供对W3C Storage接口(http://dev.w3.org/html5/webstorage/#the-localstorage-attribute)的访问。
  1. var storage = window.localStorage; 

方法

  • key:返回指定位置的键的名称。
  • getItem: 返回指定键所对应的记录。
  • setItem:存储一个键值对。
  • removeItem:删除指定键对应的记录。
  • clear:删除所有的键值对。

详述

  • localStorage提供对W3C Storage接口的访问,可以使用键值对的方式存储数据。

支持的平台

  • Android
  • BlackBerry WebWorks(OS 6.0或更高版本)
  • iPhone

Key 的简单范例

  1. var keyName = window.localStorage.key(0); 

Set Item的简单范例

  1. window.localStorage.setItem("key""value"); 

Get Item的简单范例

  1. var value = window.localStorage.getItem("key"); 
  2. // value的值现在是"value" 

Remove Item的简单范例

  1. window.localStorage.removeItem("key"); 

Clear的简单范例

  1. window.localStorage.clear(); 

完整的范例

  1. <!DOCTYPE html> 
  2. <html> 
  3. <head>     
  4. <title>Contact Example</title> 
  5.  
  6. <script type="text/javascript" charset="utf-8" src="phonegap.js"></script> 
  7. <script type="text/javascript" charset="utf-8"> 
  8.  
  9. // 等待加载PhoneGap 
  10. document.addEventListener("deviceready", onDeviceReady, false); 
  11.  
  12. // PhoneGap加载完毕 
  13. function onDeviceReady() { 
  14.        window.localStorage.setItem("key", "value"); 
  15.        var keyname = window.localStorage.key(i); 
  16.        [译注:应当是var keyname = window.localStorage.key(0);] 
  17.        // keyname的值现在是“key” 
  18.        var value = window.localStorage.getItem("key"); 
  19.        // value的值现在是“value” 
  20.        window.localStorage.removeItem("key"); 
  21.        window.localStorage.setItem("key2", "value2"); 
  22.        window.localStorage.clear(); 
  23.        // localStorage现在是空的 
  24.  
  25. </script> 
  26. </head> 
  27. <body> 
  28.     <h1>Example</h1> 
  29.     <p>localStorage</p> 
  30. </body> 
  31. </html> 

 

责任编辑:佚名 来源: PhoneGap中国
相关推荐

2011-12-19 16:09:32

PhoneGap APCamera

2011-12-20 11:20:46

PhoneGap APCompass

2011-12-22 09:54:40

PhoneGap APMedia

2011-12-22 09:27:36

PhoneGap APGeolocation

2011-12-19 16:26:39

PhoneGap APCapture

2011-12-22 10:33:39

PhoneGap APNotificatio

2011-12-20 15:34:55

PhoneGap APConnection

2011-12-21 21:56:45

PhoneGap APFile

2011-12-20 17:15:52

PhoneGap APEvents

2011-12-19 15:30:25

AccelerometPhoneGap AP

2011-12-20 13:32:52

PhoneGap APContacts

2011-12-20 16:09:57

PhoneGap APDevice

2011-12-30 13:47:57

PhoneGap AP视频Contacts

2011-12-30 13:59:38

PhoneGap APDevice视频

2011-12-30 14:09:32

PhoneGap APCompass视频

2011-09-13 14:07:45

PhoneGap AP

2011-12-30 14:13:05

PhoneGap APCamera视频

2011-12-30 14:05:17

PhoneGap APConnection视频

2011-12-30 14:16:02

AccelerometPhoneGap AP视频

2011-07-05 17:29:53

PhoneGapevents
点赞
收藏

51CTO技术栈公众号