pouchdb快速入門教程
本教程將開發創建一個基於TodoMVC的Todo web應用。該應用將與服務端的 CouchDB 進行同步。學習本教程將花費大概10分鍾左右的時間。
說明
本教程講解的主要運行環境為linux系統，但不代表pouchdb需要linux才能運行。
教程用到的python只是為了方便啟動一個簡化的web服務，你可以根據自己的實際情況，選擇合適的web服務，比如apache, nginx等。
下載文件
開始該教程前，需要先下載一個模板項目pouchdb-getting-started-todo.zip。解壓后，執行下面的命令，啟動一個內置的web服務。
$ cd pouchdb-getting-started-todo
$ python -m SimpleHTTPServer
執行命令后，打開 http://127.0.0.1:8000/ 。如果看到了下面的圖片，就表示該應用安裝成功。
通過打開瀏覽器的控制台，你可以查看任何錯誤或者一些確認信息。
安裝PouchDB
用編輯器打開 index.html ，添加PouchDB的引用腳本：
<script src="//cdn.jsdelivr.net/pouchdb/3.5.0/pouchdb.min.js"></script>
<script src="js/base.js"></script>
<script src="js/app.js"></script>
現在PouchDB已經成功安裝到應用內，是不是很簡單。你可以在該應用上使用PouchDB的所有功能。
創建數據庫
接下來，我們的主要代碼都在app.js文件內完成。 開始添加待辦前，需要創建一個數據庫。PouchDB創建一個新數據庫的腳本如下：
// EDITING STARTS HERE (you dont need to edit anything above this line)
var db = new PouchDB('todos');
var remoteCouch = false;
由於PouchDB是一個文檔型數據庫，與關系型數據庫不同的地方是，不需要創建元數據。給定一個名稱后，PouchDB就立即創建一個數據庫，然后你就可以往數據庫里寫數據了。
添加todos到數據庫內
首先我們需要提供一個輸入待辦todos到數據庫的方法。當用戶在輸入完todo內容，按下回車后，系統將調用addTodo方法，實現將待辦todos添加到數據庫內。具體的實現代碼如下：
function addTodo(text) {
var todo = {
_id: new Date().toISOString(),
title: text,
completed: false
};
db.put(todo, function callback(err, result) {
if (!err) {
console.log('Successfully posted a todo!');
}
});
}
在PouchDB里，每一條數據都需要一個唯一的主鍵_id。任何提交的數據里，如果有相同的_id，PouchDB都將更新相同_id下的數據，否則創建一條新的_id數據。在這里，我們使用創建的時間做為_id主鍵，這樣的好處是既能保證_id的唯一性，又能在方便的在數據庫里進行排序。如果你不想自己生成_id值，可以使用db.post()方法提交不包含_id的數據。創建的數據最少只需要_id該字段，最多理論上可以有無數個。
回調函數 callback 將在數據完成插入到數據庫后執行，這里的完成可能是成功插入到數據庫，也可能是出現錯誤插入失敗的完成。在回調函數里，如果 err 非空，將代表插入的數據失敗，同時包含失敗的原因，否則就是插入成功，result里將返回成功后的數據_id和_rev。_rev是這條數據的版本號。
從數據庫里拉取待辦列表
在模板代碼里已經提供了一個 redrawTodosUI 方法，用於顯示待辦列表組，我們只需要提供一個從數據庫里取得待辦列表數據的功能。在這里，我們可以使用方法 db.allDocs 簡單的從數據庫里取得所有待辦列表數據。 PouchDB在返回數據列表時，僅包含了_id和_revs兩薦數據，通過include_docs選項可以讓PouchDB在返回數據列表時包含數據的詳細信息。descending選項可以讓PouchDB對結果集進行倒序操作。
function showTodos() {
db.allDocs({include_docs: true, descending: true}, function(err, doc) {
redrawTodosUI(doc.rows);
});
}
添加完上面的代碼后，就可以通過刷新頁面查看你所有添加的待辦todos列表。
更新UI
我們不想每次更新一個待辦列表都要刷新一下頁面。更加人性化的處理是，每次更新數據時，自動更新UI界面。由於PouchDB需要同步數據到遠程數據庫，因此需要在服務器數據被修改時同步更新到客戶端。通過db.changes可以實現監聽數據庫的更新。可以在remoteCouch和addTodo代碼間添加下面的代碼：
var remoteCouch = false;
db.changes({
since: 'now',
live: true
}).on('change', showTodos);
// We have to create a new todo document and enter it in the database
function addTodo(text) {
現在，每一次的數據庫更新，我們都可以重新渲染UI來顯示新的數據。選項live表示該方法將一直監控運行。輸入新的待辦后，應用將立即顯示新添加的待辦項。
編輯待辦列表
當選中checkbox后，checkboxChanged方法將會被執行。添加下面的代碼實現編輯待辦事項：
function checkboxChanged(todo, event) {
todo.completed = event.target.checked;
db.put(todo);
}
該方法和創建一個新的待辦列表很像，不同的是該待辦必須包含一個_rev項（還包括_id項），否則在提交到PouchDB時，就會提交失敗。
現在，你可以通過選中多選框來表明待辦項完成，或者去掉選中來重新進入待辦。
刪除一個待辦列表
想要刪除一個待辦數據，可以調用 db.remove 方法。
function deleteButtonPressed(todo) {
db.remove(todo);
}
跟編輯一個數據一樣，刪除一條數據也需要同時提供 _id 和 _rev 項。可能大家都會注意到，我們這里直接把整個對像傳遞到了方法 db.remove 方法內，實際上，PouchDB只會關注傳遞對像里的 _id 和 _rev 兩項，如果你自己構建一個對像 {_id: todo._id, _rev: todo._rev}，效果也是一樣的，只是為了方便而以。
Complete rest of the Todo UI
編輯一條數據時， todoBlurred方法將會被執行。如果用戶輸入了一個空白的標題待辦，我們將會刪除該條數據，否則只是更新下待辦項。
function todoBlurred(todo, event) {
var trimmedText = event.target.value.trim();
if (!trimmedText) {
db.remove(todo);
} else {
todo.title = trimmedText;
db.put(todo);
}
}
安裝CouchDB
現在我們開始實現同步功能。首先需要安裝CouchDB，你可以自己在本地安裝 CouchDB(1.3+) 或者使用一個在線的 CouchDB服務，比如 IrisCouch。
打開跨域訪問
為了實現同步數據功能，需要在CouchDB里打開跨域訪問的功能。CouchDB默認是以管理員身份安裝，並不需要提供用戶名和密碼，如果你設置了用戶名和密碼，在連接同步時，也需要一起提供。下面的代碼里，如果是本地安裝，需要將 myname.iriscouch.com 替換成本地CouchDB的地址（比如：127.0.0.1:5984）
你也可以通過使用curl 或者 Futon web 接口來打開CORS。為了方便，我們提供了一個 Node 腳本 add-cors-to-couchdb。執行一下就可以打開跨域訪問功能。
$ npm install -g add-cors-to-couchdb
$ add-cors-to-couchdb
如果你的數據庫地址不是 127.0.0.1:5984:
$ add-cors-to-couchdb http://me.iriscouch.com -u myusername -p mypassword
通過 http://localhost:5984/_utils/config.html 你可以檢測是否打開CORS功能。你會看到類似的效果：
實現基本的雙向同步功能
現在我們就可以開始真正的同步功能。回到 app.js ，我們需要提供一個遠程數據庫的地址。記得把 user, pass 和 myname.iriscouch.com 替換成你CouchDB的帳戶信息。
// EDITING STARTS HERE (you dont need to edit anything above this line)
var db = new PouchDB('todos');
var remoteCouch = 'http://user:pass@mname.iriscouch.com/todos';
實現同步功能的代碼：
function sync() {
syncDom.setAttribute('data-sync-state', 'syncing');
var opts = {live: true};
db.replicate.to(remoteCouch, opts, syncError);
db.replicate.from(remoteCouch, opts, syncError);
}
db.replicate() 告訴 PouchDB從 from remoteCouch 傳輸所有文檔到本地或者將本地所有文檔傳輸到to remoteCouch。 remoteCouch可以是一個合法的地址串，也可以是另一個PouchDB實例。PouchDB將會執行兩次同步：一次接收從遠程數據庫里傳輸過來的數據，另一次就是提交本地修改到遠程數據庫里。live 標識用於告訴PouchDB持續執行更同步動作，也就是實時監控數據庫的變化。當同步完成后，將會有一個會調函數接口。對於實時的同步，可能需要處理一些異常情況，比如鏈接丟失或者取消同步。
現在你可以在另一個窗口打開應用the todo app，查看兩邊的待辦列表是否同步一致。你也可以通過CouchDB提供的 Futon 管理頁面，查看更新的數據。
恭喜你
完成上面的步驟，你就成功實現了一個基於PouchDB的應用。這是一個很基礎的例子，現實生產中的應用可能比這個要復雜得多，包括錯誤的驗證，登錄等。但通過這樣一個例子，完全可以讓你了解PouchDB的工作原理。如果你有更多的疑問，可以與聯系IRC 或者 the mailing list
小書匠
該文檔使用小書匠編輯器編輯完成，並通過客戶端發布到博客園系統，
原英文地址：http://pouchdb.com/getting-started.html
中文地址轉載地址： http://www.cnblogs.com/suziwen/p/4507684.html
轉載請注明地址。