html5本地存儲之indexedDb

對於以下需求：

離線存儲讀取數據
允許用戶對數據進行增刪改操作
數據存儲在本地，不依賴後端
數據支持索引查詢
我們可以考慮使用html5新特性的本地存儲，主要有以下幾種：

Web Sql(IE,FF都不支持,http://www.w3.org/TR/webdatabase/)
IndexedDB
Local Storage(輕鬆存儲簡單的數據結構，如果存儲複雜的較麻煩)
Session Storage(同Localstorage)
Cookies(有限制)
Application Cache(隨後介紹)
我們可以考慮使用indexedDb來實現功能：

首先定義數據庫對象

var testDB = {
name : “eason”,
version: 1,
db : null};
然後是數據庫初始化：

function initDB(dbObj) {
dbObj.version = dbObj.version || 1;
var request = indexedDB.open(dbObj.name, dbObj.version);
request.onerror = function (e) {
console.log(e.currentTarget.error.message);
};
request.onsuccess = function (e) {
dbObj.db = e.target.result;
};
request.onupgradeneeded = function (e) {
var thisDB = e.target.result;
if (!thisDB.objectStoreNames.contains(“material”)) {
var objStore = thisDB.createObjectStore(“material”,
{keyPath: “id”, autoIncrement: true});
objStore.createIndex(“wxid”, “wxid”, {unique: true});
}
if (!thisDB.objectStoreNames.contains(“account”)) {
var objStore = thisDB.createObjectStore(“account”,
{keyPath: “id”, autoIncrement: true});
objStore.createIndex(“wxid”, “wxid”, {unique: true});
objStore.createIndex(“nickName”, “nickName”, {unique: false});
}
};
關閉數據庫：

function closeDB(dbObj) {
dbObj.db.close();
}
刪除數據庫：

function deleteDB(dbObj) {
indexedDB.deleteDatabase(dbObj.name);
}
數據庫表的CRUD操作：

Create：

function addData(dbObj, tableName, data, cb) {
var transaction = dbObj.db.transaction(tableName, ‘readwrite’);
transaction.oncomplete = function () {
console.log(“transaction complete”);
};
transaction.onerror = function (event) {
console.dir(event)
};
var objectStore = transaction.objectStore(tableName);
var request = objectStore.add(data);
request.onsuccess = function (e) {
if (cb) {
cb({
error: 0,
data : data
})
}
};
request.onerror = function (e) {
if (cb) {
cb({
error: 1
})
}
}
}
刪除數據：

function deleteData(dbObj, tableName, id, cb) {
var transaction = dbObj.db.transaction(tableName, ‘readwrite’);
transaction.oncomplete = function () {
console.log(“transaction complete”);
};
transaction.onerror = function (event) {
console.dir(event)
};
var objectStore = transaction.objectStore(tableName);
var request = objectStore.delete(parseInt(id));
request.onsuccess = function (e) {
if (cb) {
cb({
error: 0,
data : parseInt(id)
})
}
};
request.onerror = function (e) {
if (cb) {
cb({
error: 1
})
}
}
}
查詢數據：

（1）查詢全部：

function getDataAll(dbObj, tableName, cb) {
var transaction = dbObj.db.transaction(tableName, ‘readonly’);
transaction.oncomplete = function () {
console.log(“transaction complete”);
};
transaction.onerror = function (event) {
console.dir(event)
};
var objectStore = transaction.objectStore(tableName);
var rowData = [];
objectStore.openCursor(IDBKeyRange.lowerBound(0)).onsuccess = function (event) { var cursor = event.target.result;
if (!cursor && cb) {
cb({
error: 0,
data : rowData
}); return;
}
rowData.push(cursor.value);
cursor.continue();
};
}
（2）根據id查詢數據

function getDataById(dbObj, tableName, id, cb) {
var transaction = dbObj.db.transaction(tableName, ‘readwrite’);
transaction.oncomplete = function () {
console.log(“transaction complete”);
};
transaction.onerror = function (event) {
console.dir(event)
};
var objectStore = transaction.objectStore(tableName);
var request = objectStore.get(id);
request.onsuccess = function (e) {
if (cb) {
cb({
error: 0,
data : e.target.result
})
}
};
request.onerror = function (e) {
if (cb) {
cb({
error: 1
})
}
}
}
（3）根據關鍵詞索引數據：

function getDataBySearch(dbObj, tableName, keywords, cb) {
var transaction = dbObj.db.transaction(tableName, ‘readwrite’);
transaction.oncomplete = function () {
console.log(“transaction complete”);
};
transaction.onerror = function (event) {
console.dir(event)
};
var objectStore = transaction.objectStore(tableName);
var boundKeyRange = IDBKeyRange.only(keywords); var rowData;
objectStore.index(“nickName”).openCursor(boundKeyRange).onsuccess = function (event) { var cursor = event.target.result;
if (!cursor) {
if (cb) {
cb({
error: 0,
data : rowData
})
} return;
}
rowData = cursor.value;
cursor.continue();
};
}
（4）根據頁面索引數據：

function getDataByPager(dbObj, tableName, start, end, cb) {
var transaction = dbObj.db.transaction(tableName, ‘readwrite’);
transaction.oncomplete = function () {
console.log(“transaction complete”);
};
transaction.onerror = function (event) {
console.dir(event)
};
var objectStore = transaction.objectStore(tableName);
var boundKeyRange = IDBKeyRange.bound(start, end, false, true);
var rowData = [];
objectStore.openCursor(boundKeyRange).onsuccess = function (event) {
var cursor = event.target.result;
if (!cursor && cb) {
cb({
error: 0,
data : rowData
}); return;
}
rowData.push(cursor.value);
cursor.continue();
};
}
更新數據：

function updateData(dbObj, tableName, id, updateData, cb) {
var transaction = dbObj.db.transaction(tableName, ‘readwrite’);
transaction.oncomplete = function () {
console.log(“transaction complete”);
};
transaction.onerror = function (event) {
console.dir(event)
};
var objectStore = transaction.objectStore(tableName);
var request = objectStore.get(id);
request.onsuccess = function (e) {
var thisDB = e.target.result;
for (key in updateData) {
thisDB[key] = updateData[key];
}
objectStore.put(thisDB);
if (cb) {
cb({
error: 0,
data : thisDB
})
}
};
request.onerror = function (e) {
if (cb) {
cb({
error: 1
})
}
}
}
in 文章 | 2015年8月26日 | 571 Words | Comment
windows和linux下安裝redis
1、redis簡介
redis是一個key-value存儲系統。和Memcached類似，它支持存儲的value類型相對更多，包括string(字符串)、list(鏈表)、set(集合)、zset(sorted set –有序集合)和hashs（哈希類型）。這些數據類型都支持push/pop、add/remove及取交集並集和差集及更豐富的操作，而且這些操作都是原子性的。在此基礎上，redis支持各種不同方式的排序。與memcached一樣，爲了保證效率，數據都是緩存在內存中。區別的是redis會週期性的把更新的數據寫入磁盤或者把修改操作寫入追加的記錄文件，並且在此基礎上實現了master-slave(主從)同步。

Redis 是一個高性能(存儲在內存中)的key-value數據庫。 redis的出現，很大程度補償了memcached這類key/value存儲的不足，在部分場合可以對關係數據庫起到很好的補充作用。它提供了Python，Ruby，Erlang，PHP客戶端，使用很方便。

2、windows下安裝redis
下載地址https://github.com/dmajkic/redis/downloads。下載到的Redis支持32bit和64bit（或者可以下載exe文件，路徑是 https://github.com/rgl/redis/downloads ）。根據自己實際情況選擇，我選擇64bit。直接進入到64位的目錄,我的目錄是：E:\dev\redis-2.4.5-win32-win64\64bit

打開一個cmd窗口切換到64爲文件所在的目錄運行： redis-server.exe redis.conf 。出現如下界面：

wKiom1SiEbHQw7SrAAFnKMDoqK8470.jpg

這就說明Redis服務端已經安裝成功。

打開一個cmd窗口切換到64爲文件所在的目錄運行 redis-cli.exe -h 127.0.0.1 -p 6379，其中 127.0.0.1是本地ip，6379是redis服務端的默認端口。運行成功如下圖所示。

wKiom1SiEkfxAA6qAACop0g2W3E221.jpg

下面做個小測試：

wKioL1SiE3biQfIHAADoXzjr2mM593.jpg

如果能正常顯示，說明已經ok了，可以正常使用了

Linux ubuntu上安裝redis

本人使用的是Ubuntu 14.04 lts，安裝Redis可以通過apt-get命令安裝，完整的命令如下：

sudo apt-get install redis-server
安裝以後，數據庫可以自動啓動，先檢查下redis的進程：

ps -aux|grep redis
redis 4162 0.1 0.0 10676 1420 ? Ss 23:24 0:00 /usr/bin/redis-server /etc/redis/redis.conf
conan 4172 0.0 0.0 11064 924 pts/0 S+ 23:26 0:00 grep –color=auto redis
再查看下狀態看是否啓動：

netstat -nlt|grep 6379
tcp 0 0 127.0.0.1:6379 0.0.0.0:* LISTEN
安裝server後會自動安裝一個命令行工具redis-cli,在任意目錄下運行redis-cli即可啓動服務,請自行測試。

Redis配置：

（1）登錄密碼

默認情況下，訪問Redis服務器是不需要密碼的，爲了增加安全性我們需要設置Redis服務器的訪問密碼。

用vi打開Redis服務器的配置文件redis.conf

sudo vi /etc/redis/redis.conf

取消註釋requirepass

requirepass redistest //redistest 爲密碼

重新登錄 redis-cli -a redistest ,如果不使用密碼登錄，雖然能登錄成功但是提示操作沒有權限
（2）支持遠程

默認情況下，Redis服務器不允許遠程訪問，只允許本機訪問。

sudo vi /etc/redis/redis.conf

註釋bind

bind 127.0.0.1

基本的配置就到這裏，歡迎留言！