Menambahkan sinkronisasi data offline ke aplikasi .NET MAUI Anda

Artikel
01/12/2024

Nota

Produk ini dihentikan. Untuk pengganti proyek yang menggunakan .NET 8 atau yang lebih baru, lihat pustaka Community Toolkit Datasync.

Tutorial ini mencakup fitur sinkronisasi offline Azure Mobile Apps untuk .NET MAUI. Sinkronisasi offline memungkinkan pengguna akhir berinteraksi dengan aplikasi seluler bahkan ketika tidak ada koneksi jaringan. Perubahan disimpan dalam database lokal. Setelah perangkat kembali online, perubahan ini disinkronkan dengan backend jarak jauh.

Sebelum memulai tutorial ini, Anda harus telah menyelesaikan tutorial mulai cepat .NET MAUI, yang mencakup pembuatan layanan backend yang sesuai.

Untuk mempelajari selengkapnya tentang fitur sinkronisasi offline, lihat topik Sinkronisasi Data Offline di Azure Mobile Apps.

Memperbarui aplikasi untuk mendukung sinkronisasi offline

Dalam operasi online, Anda membaca dan menulis dari IRemoteTable<T>. Saat menggunakan sinkronisasi offline, Anda membaca dan menulis dari IOfflineTable<T> sebagai gantinya. IOfflineTable didukung oleh database SQLite di perangkat, dan disinkronkan dengan database backend.

Di Visual Studio:

Klik kanan pada solusi TodoApp, lalu pilih Kelola Paket NuGet untuk Solusi....
Di tab baru, pilih Telusuri, lalu masukkan Microsoft.Datasync.Client di kotak pencarian.
Pilih paket Microsoft.Datasync.Client.SQLiteStore.
Di panel kanan, pilih semua proyek klien (kecuali proyek TodoAppService.NET6).
Pilih Instal.
Terima perjanjian lisensi saat diminta.

Memperbarui klien layanan jarak jauh

Buka proyek TodoApp.Data dan temukan kelas RemoteTodoService.cs (dalam direktori Services). Perbarui kelas sebagai berikut:

Tambahkan pernyataan using berikut ke bagian atas file:
```
using Microsoft.Datasync.Client.SQLiteStore;
```

Ubah definisi _table menjadi IOfflineTable<TodoItem>:

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

Tambahkan properti baru untuk menyimpan lokasi database offline:

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

Perbarui metode InitializeAsync untuk menentukan database offline:

// 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;

Perbarui RefreshItemsAsync() untuk melakukan sinkronisasi offline:

/// <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;
}

Mengatur lokasi database offline

Dalam proyek TodoApp.MAUI, edit file MainPage.xaml.cs. Ubah definisi RemoteTodoService sebagai berikut:

TodoService = new RemoteTodoService(GetAuthenticationToken)
{
    OfflineDb = FileSystem.CacheDirectory + "/offline.db"
};

Jika Anda belum menyelesaikan tutorial autentikasi , definisi akan terlihat seperti ini sebagai gantinya:

TodoService = new RemoteTodoService()
{
    OfflineDb = FileSystem.CacheDirectory + "/offline.db"
};

Menguji aplikasi

Aplikasi tidak disinkronkan dengan backend hingga ikon refresh ditekan. Untuk menguji:

Buka portal Microsoft Azure .
Buka grup sumber daya yang berisi sumber daya untuk mulai cepat.
Pilih database quickstart.
Pilih editor kueri (pratinjau).
Masuk dengan autentikasi server SQL menggunakan kredensial yang sama dengan yang Anda siapkan untuk database.
- Jika perlu, Anda akan diminta untuk mengizinkan akses untuk alamat IP Anda. Pilih tautan untuk memperbarui daftar yang diizinkan, lalu tekan OK untuk mencoba kembali login.
Di editor kueri, masukkan SELECT * FROM [dbo].[TodoItems]. Lalu pilih Jalankan.

Daftar TodoItems saat ini akan ditampilkan.

Cuplikan layar hasil di editor kueri S Q L.

Sekarang, buat beberapa perubahan melalui aplikasi Anda. JANGAN TEKAN REFRESH (belum).

Ulangi pernyataan SQL di portal Microsoft Azure dan verifikasi bahwa tidak ada perubahan yang dilakukan pada data dalam database.

Pilih ikon Refresh di aplikasi Anda untuk mendorong data dalam antrean ke layanan backend. Anda akan melihat transaksi HTTP yang terjadi di jendela Debug Output.

Ulangi pernyataan SQL di portal Microsoft Azure dan verifikasi bahwa perubahan Anda telah didorong ke layanan jarak jauh.

Membersihkan sumber daya

Kecuali Anda melakukan tutorial mulai cepat lainnya, Anda dapat menghapus sumber daya yang terkait dengan layanan backend sekarang.

Buka portal Microsoft Azure .
Pilih grup sumber daya yang menyimpan sumber daya mulai cepat.
Pilih Hapus grup sumber daya.
Ikuti instruksi untuk mengonfirmasi penghapusan.

Anda juga dapat menggunakan Azure CLI:

az group delete -g quickstart

Jika Anda menggunakan Azure Developer CLI untuk menyebarkan sumber daya, Anda dapat menggunakan perintah azd down sebagai gantinya.

Penghapusan akan memakan waktu beberapa menit untuk diselesaikan.

Langkah berikutnya

Tinjau dokumentasi CARA:
- ASP. dokumentasi layanan NET6
- dokumentasi klien .NET

Bagikan melalui