概觀
本教學課程介紹適用於 Cordova 的 Azure Mobile Apps 離線同步處理功能。 離線同步可讓終端使用者與行動應用程式互動，即使在沒有網路連線時，也能檢視、新增或修改資料。 變更會儲存在本機資料庫中。 裝置重新上線后，這些變更會與遠端服務同步。
本教學課程是以您完成 Apache Cordova 快速入門教學課程時所建立之 Mobile Apps 的 Cordova 快速入門解決方案為基礎。 在本教學課程中，您會更新快速入門解決方案，以新增 Azure Mobile Apps 的離線功能。 我們也會強調應用程式中的特定離線程式碼。
若要深入瞭解離線同步功能，請參閱 Azure Mobile Apps 中的離線數據同步主題。 如需 API 使用方式的詳細資訊，請參閱 API 檔。
將離線同步新增至快速入門解決方案
離線同步程式代碼必須新增至應用程式。 離線同步需要 Cordova-sqlite-storage 插件，當專案中包含 Azure Mobile Apps 插件時，Cordova-sqlite-storage 插件會自動添加至您的應用程式。 快速入門專案包含這兩個外掛程式。
在 Visual Studio 的方案總管中，開啟 index.js 並取代下列程式代碼
var client, // Connection to the Azure Mobile App backend todoItemTable; // Reference to a table endpoint on backend使用此段程式碼：
var client, // Connection to the Azure Mobile App backend todoItemTable, // Reference to a table endpoint on backend syncContext; // Reference to offline data sync context接下來，取代下列程序代碼：
client = new WindowsAzure.MobileServiceClient('http://yourmobileapp.azurewebsites.net');使用此段程式碼：
client = new WindowsAzure.MobileServiceClient('http://yourmobileapp.azurewebsites.net'); var store = new WindowsAzure.MobileServiceSqliteStore('store.db'); store.defineTable({ name: 'todoitem', columnDefinitions: { id: 'string', text: 'string', complete: 'boolean', version: 'string' } }); // Get the sync context from the client syncContext = client.getSyncContext();上述程式代碼新增會初始化本地存儲，並定義符合 Azure 後端所用資料行值的本機數據表。 （您不需要在此程式代碼中包含所有資料行值。欄位
version會由行動後端維護，並用於解決衝突。您可以藉由呼叫 getSyncContext 來取得同步內容的參考。 同步處理內容可追蹤和推送用戶端應用程式在呼叫
.push()時修改的所有資料表中變更，藉以協助保留數據表關聯性。將應用程式 URL 更新為行動應用程式的 URL。
接下來，取代此程式代碼：
todoItemTable = client.getTable('todoitem'); // todoitem is the table name使用此段程式碼：
// Initialize the sync context with the store syncContext.initialize(store).then(function () { // Get the local table reference. todoItemTable = client.getSyncTable('todoitem'); syncContext.pushHandler = { onConflict: function (pushError) { // Handle the conflict. console.log("Sync conflict! " + pushError.getError().message); // Update failed, revert to server's copy. pushError.cancelAndDiscard(); }, onError: function (pushError) { // Handle the error // In the simulated offline state, you get "Sync error! Unexpected connection failure." console.log("Sync error! " + pushError.getError().message); } }; // Call a function to perform the actual sync syncBackend(); // Refresh the todoItems refreshDisplay(); // Wire up the UI Event Handler for the Add Item $('#add-item').submit(addItemHandler); $('#refresh').on('click', refreshDisplay);上述程式碼會初始化同步內容，然後呼叫 getSyncTable（而不是 getTable），以取得本機資料表的參考。
此程式代碼會使用本機資料庫來進行所有建立、讀取、更新和刪除 （CRUD） 數據表作業。
此範例會在同步衝突上執行簡單的錯誤處理。 實際的應用程式會處理各種錯誤，例如網路狀況、伺服器衝突和其他錯誤。 如需程式代碼範例，請參閱 離線同步處理範例。
接下來，新增此函式以執行實際的同步處理。
function syncBackend() { // Sync local store to Azure table when app loads, or when login complete. syncContext.push().then(function () { // Push completed }); // Pull items from the Azure table after syncing to Azure. syncContext.pull(new WindowsAzure.Query('todoitem')); }您決定何時呼叫 syncContext.push（）將變更推送至行動應用程式後端。 例如，您可以在系結至同步按鈕的按鈕事件處理程式中呼叫 syncBackend 。
離線同步的考量
在範例中，syncContext 的 push 方法只會在回呼函式中的 app 啟動時呼叫以進行登入。 在真實世界中，您也可以手動觸發此同步處理功能，或在網路狀態變更時觸發。
針對由內容追蹤的尚未完成本機更新的數據表執行提取操作時，該操作會自動觸發推送。 在此範例中重新整理、新增和完成專案時，您可以省略明確的 推送 呼叫，因為它可能是多餘的。
在提供的程式代碼中，會查詢遠端 todoItem 數據表中的所有記錄，但也可以通過傳遞查詢 ID 和查詢語句到 推送方法來篩選記錄。 如需詳細資訊，請參閱 Azure Mobile Apps 中離線數據同步的累加同步一節。
（選擇性）停用驗證
如果您不想在測試離線同步處理之前設定驗證，請將登入的回呼函式批注化，但讓回呼函式內的程式碼保持未批注。 將登入行註解掉之後，接下來的程式代碼如下：
// Login to the service.
// client.login('twitter')
// .then(function () {
syncContext.initialize(store).then(function () {
// Leave the rest of the code in this callback function uncommented.
...
});
// }, handleError);
現在，當您執行應用程式時，應用程式會與 Azure 後端同步處理。
執行用戶端應用程式
現在啟用離線同步處理後，您至少可以在每個平台上執行用戶端應用程式一次，以填入本地存儲資料庫。 稍後，模擬脫機案例，並在應用程式離線時修改本地存儲中的數據。
（選擇性）測試同步處理行為
在本節中，您會使用無效的後端應用程式 URL，來修改用戶端專案，以模擬脫機情境。 當您新增或變更數據項時，這些變更會保留在本地存儲中，但在重新建立連線之前，不會同步處理至後端數據存放區。
在 [方案總管] 中，開啟 index.js 項目檔，並將應用程式 URL 變更為指向無效的 URL，例如下列程式代碼：
client = new WindowsAzure.MobileServiceClient('http://yourmobileapp.azurewebsites.net-fail');在 index.html中，以相同的無效 URL 將 CSP
<meta>元素更新。<meta http-equiv="Content-Security-Policy" content="default-src 'self' data: gap: http://yourmobileapp.azurewebsites.net-fail; style-src 'self'; media-src *">建置並執行用戶端應用程式，並注意到當應用程式在登入後嘗試與後端同步時，主控台會記錄例外狀況。 您新增的任何新專案都只存在於本地存儲中，直到它們推送至行動後端為止。 用戶端應用程式的行為就像連線到後端一樣。
關閉應用程式，然後重新啟動它，以確認您所建立的新專案會保存至本地存儲。
（選擇性）使用 Visual Studio 檢視您的 Azure SQL Database 數據表，以查看後端資料庫中的數據尚未變更。
在 Visual Studio 中，開啟 [伺服器總管]。 導航至 Azure->SQL 資料庫 中的您的資料庫。 以滑鼠右鍵按下您的資料庫，然後選取 [在 SQL Server 物件總管中開啟] 。 現在您可以瀏覽至 SQL 資料庫資料表及其內容。
（選擇性）測試重新連線到行動後端
在本節中，您會將應用程式重新連線到行動後端，以模擬應用程式回到在線狀態。 當您登入時，數據會同步處理至行動後端。
重新開啟 index.js 並還原應用程式URL。
重新開啟 index.html 並更正 CSP
<meta>專案中的應用程式 URL。重建並執行客戶端應用程式。 應用程式會在登入後嘗試與行動應用程式後端同步處理。 確認偵錯控制台中未記錄任何例外狀況。
（選擇性）使用 SQL Server 物件總管或 Fiddler 等 REST 工具檢視更新的數據。 請注意，後端資料庫與本地存儲之間已同步處理數據。
請注意，資料庫與本地存儲之間的數據已同步處理，並包含您在應用程式中斷連線時新增的專案。