Windows (UWP) アプリにオフライン データ同期を追加する

このチュートリアルでは、UWP クイックスタート アプリ向けの Azure Mobile Apps のオフライン同期機能について説明します。 オフライン同期を使用すると、エンド ユーザーはネットワークにアクセスできなくても、データの表示、追加、変更など、モバイル アプリとやり取りできます。 変更は、ローカル データベースに格納されます。 デバイスが再びオンラインになると、これらの変更がリモート バックエンドと同期されます。

このチュートリアルを開始する前に、適切なバックエンド サービスを作成することを含む UWP クイックスタート チュートリアルを完了している必要があります。 また、お使いのアプリケーションに認証を追加していることを想定しています。 認証なしに、アプリにオフライン機能を追加することが可能です。

オフライン同期をサポートするようにアプリケーションを更新する

オンライン操作では、IRemoteTable<T> に対して読み取りと書き込みを行います。 オフライン同期を使用する場合は、代わりに IOfflineTable<T> に対して読み取りと書き込みを行います。 IOfflineTable<T> は、デバイス上の SQLite データベースによってサポートされ、バックエンド データベースと同期されます。

必要な NuGet パッケージを追加する

Visual Studio で次の操作を行います。

1. TodoAppソリューションを右クリックし、[ソリューションの NuGet パッケージの管理] を選択します。

2. 新しいタブで [参照] を選択し、検索ボックスに「Microsoft.Datasync.Client」と入力します。

   

3. Microsoft.Datasync.Client.SQLiteStore パッケージを選択します。

4. 右側のウィンドウで、(TodoAppService.NET6プロジェクトを除く) すべてのクライアント プロジェクトを選択します。

5. [インストール] を選択します。

6. メッセージが表示されたら、使用許諾契約書に同意します。

リモート サービス クライアントを更新する

TodoApp.Dataプロジェクトを開き、RemoteTodoService.csクラス(Servicesディレクトリ内) を選択します。 このクラスを次のように更新します。

1. 次の using ステートメントをファイルの先頭に追加します。

   using Microsoft.Datasync.Client.SQLiteStore;
   

2. _table の定義を IOfflineTable<TodoItem> に変更します。

   /// <summary>
   /// Reference to the table used for datasync operations.
   /// </summary>
   private IOfflineTable<TodoItem> _table = null;
   

3. オフライン データベースの保存先となる新しいプロパティを追加します。

   /// <summary>
   /// The path to the offline database
   /// </summary>
   public string OfflineDb { get; set; }
   

4. InitializeAsync メソッドを更新して、オフライン データベースを定義します。

   // Create the offline store definition
   var connectionString = new UriBuilder { Scheme = "file", Path = OfflineDb, Query = "?mode=rwc" }.Uri.ToString();
   var store = new OfflineSQLiteStore(connectionString);
   store.DefineTable<TodoItem>();
   var options = new DatasyncClientOptions
   {
       OfflineStore = store,
       HttpPipeline = new HttpMessageHandler[] { new LoggingHandler() }
   };
   
   // Create the datasync client.
   _client = TokenRequestor == null 
       ? new DatasyncClient(Constants.ServiceUri, options)
       : new DatasyncClient(Constants.ServiceUri, new GenericAuthenticationProvider(TokenRequestor), options);
   
   // Initialize the database
   await _client.InitializeOfflineStoreAsync();
   
   // Get a reference to the offline table.
   _table = _client.GetOfflineTable<TodoItem>();
   
   // Set _initialized to true to prevent duplication of locking.
   _initialized = true;
   

5. RefreshItemsAsync() を更新して、オフライン同期を実行します。

   /// <summary>
   /// Refreshes the TodoItems list manually.
   /// </summary>
   /// <returns>A task that completes when the refresh is done.</returns>
   public async Task RefreshItemsAsync()
   {
       await InitializeAsync();
   
       // First, push all the items in the table.
       await _table.PushItemsAsync();
   
       // Then, pull all the items in the table.
       await _table.PullItemsAsync();
   
       return;
   }
   

オフライン データベースの保存先を設定する

TodoApp.UWP プロジェクトで、App.xaml.cs ファイルを編集します。 RemoteTodoService の定義を次のように変更します。

TodoService = new RemoteTodoService(GetAuthenticationToken)
{
    OfflineDb = ApplicationData.Current.LocalCacheFolder.Path + "\\offline.db"
};

認証チュートリアルを完了していない場合、定義は上記ではなく、次のようになります。

TodoService = new RemoteTodoService()
{
    OfflineDb = ApplicationData.Current.LocalCacheFolder.Path + "\\offline.db"
};

ApplicationData が認識されない場合は、ファイルの先頭に次を追加する必要があります。

using Windows.Storage;

注意

ユニバーサル Windows プラットフォームでは、データの読み取りと書き込みの場所が制限されます。 ApplicationData.Current のストレージ フォルダーはすべて使用できます。 データは使用できるが、クラウドにバックアップしないようにするには、LocalCacheFolder を使用します。

アプリのテスト

更新アイコンを押さない限り、アプリはバックエンドと同期しません。 テストは、次のようにします。

1. Azure Portalを開きます。

2. クイック スタートのリソースが含まれているリソース グループを開きます。

3. quickstart データベースを選択します。

4. [クエリ エディター (プレビュー)] を選択します。

5. データベース用に設定したのと同じ資格情報を使用して、SQL サーバー認証でログインします。

   • 必要に応じて、お使いの IP アドレスへのアクセス許可についてのプロンプトが表示されます。 許可リストを更新するリンクを選択し、OK を押して再びログインします。

6. クエリ エディターで「SELECT * FROM [dbo].[TodoItems]」と入力します。 次に、[実行] を選択します。

現在の TodoItems の一覧が表示されます。

今度は、アプリを使用していくつかの変更を行います。 [最新の情報に更新] を押さないでください (ここではまだ)。

Azure portal で SQL ステートメントを繰り返し、データベース内のデータに変更が加えられていないことを確認します。

アプリの [最新の情報に更新] アイコンを選択して、キュー内のデータをバックエンド サービスにプッシュします。 HTTP トランザクションが実行されているのが [出力デバッグ] ウィンドウに表示されます。

Azure portal で SQL ステートメントを繰り返し、行った変更がリモート サービスにプッシュされたことを確認します。

リソースをクリーンアップする

別のクイック スタート チュートリアルを実行していない限り、バックエンド サービスに関連付けられているリソースを削除できます。

1. Azure Portalを開きます。
2. クイック スタート リソースを含むリソース グループを選択します。
3. [リソース グループの削除] を選択します。
4. 指示に沿って、削除を確認します。

Azure CLI を使うこともできます。

az group delete -g quickstart

Azure Developer CLIを使用してリソースをデプロイした場合は、代わりに コマンドをazd down使用できます。

この削除は完了までに数分かかります。

次のステップ

• 以下の HOW TO ドキュメントをご確認ください。
  • ASP.NET6 サービス ドキュメント
  • .NET クライアント ドキュメント