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

手記

この製品は提供終了です。 .NET 8 以降を使用するプロジェクトの代わりに、Community Toolkit Datasync ライブラリを参照してください。

このチュートリアルでは、Azure Mobile Apps for the Windows App SDK (WinUI3) クイック スタート アプリのオフライン同期機能について説明します。 オフライン同期を使用すると、エンド ユーザーは、ネットワーク接続がない場合でも、モバイル アプリを操作できます (データの表示、追加、変更)。 変更はローカル データベースに格納されます。 デバイスがオンラインに戻ると、これらの変更はリモート バックエンドと同期されます。

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

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

オンライン操作では、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 プロジェクトを開き、(Services ディレクトリ内の) RemoteTodoService.cs クラスを見つけます。 クラスを次のように更新します。

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.WinUI プロジェクトで、MainWindow.xaml.cs ファイルを編集します。 RemoteTodoService の定義を次のように変更します。

_service = new RemoteTodoService(GetAuthenticationToken)
{
    OfflineDb = Environment.GetFolderPath(Environment.SpecialFolder.LocalApplicationData) + "\\offline.db"
};

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

_serviceWinUI3WinUI3W = new RemoteTodoService()
{
    OfflineDb = Environment.GetFolderPath(Environment.SpecialFolder.LocalApplicationData) + "\\offline.db"
};

手記

Windows システムに対する読み取り/書き込み/作成のアクセス許可がある場合は、いつでもオフライン データベースを格納できます。 Environment.SpecialFolder クラスは、アプリケーションに従って標準の場所を提供します。

アプリをテストする

更新アイコンが押されるまで、アプリはバックエンドと同期しません。 テストするには:

1. azure portalを開きます。

2. クイック スタートのリソースを含むリソース グループを開きます。

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

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

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

   • 必要に応じて、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 クライアント ドキュメント を する