Buat aplikasi web progresif yang dapat diinstal dan dijalankan pada setiap klien

lingkungan

Visual Studio

• Visual Studio 2019

.NET (dalam bahasa Inggris)

• .NET 5.0

Apa itu Progressive Web App (PWA)?

Sederhananya, ini adalah aplikasi yang memungkinkan Anda menginstal dan menggunakan aplikasi Web di setiap perangkat seperti PC Windows, iPhone, atau Android.

Realitas Blazor WebAssembly adalah WebAssembly standar itu sendiri, sehingga implementasi di atas dimungkinkan. Ini pada dasarnya berbasis aplikasi Web, tetapi Anda juga dapat menggunakan fitur asli seperti pemberitahuan push di Plus Alpha.

Prosedur instalasi untuk pengguna juga sangat sederhana, karena hanya perlu mengunjungi halaman target dan menekan tombol instal.

Membuat Proyek PWA Blazor WebAssembly

Ini pada dasarnya sama dengan membuat proyek Blazor WebAssembly.

Cukup buat proyek seperti biasa, dan ketika Anda datang ke layar "Informasi Tambahan" di bawah ini, cukup centang "Aplikasi Web Progresif".

Selain fitur khusus PWA, pengembangan Blazor WebAssembly pada dasarnya sama dengan pola bebas PWA.

Perbedaan dari proyek non-PWA

Saat Anda membuat proyek di PWA, Anda mendapatkan beberapa file lagi.

Juga, ketika Anda membuka ,index.html beberapa kode ditambahkan yang mereferensikan file-file ini.

Coba PWA

Jalankan proyek untuk debugging.

Sampel eksekusi persis sama dengan pola tanpa PWA, tetapi ketika dijalankan dengan PWA, Anda dapat melihat bahwa tombol instal telah ditambahkan ke browser web.

Ketika Anda mengkliknya, konfirmasi untuk menginstal ditampilkan, jadi saya akan mencoba menginstal.

Ini akan membuka jendela terpisah di mana Anda dapat menjalankan aplikasi Blazor. Ini bertindak sebagai aplikasi klien, bukan browser web, sehingga Anda juga dapat mengonfigurasi pengaturan terkait OS seperti yang ditunjukkan pada gambar.

Karena diinstal, itu akan terdaftar di menu mulai seperti ini dan Anda akan dapat memulainya.

Namun, karena kontennya adalah aplikasi web, konten tersebut tidak dapat digunakan kecuali ada server yang dapat mengunduh konten tersebut. Misalnya, jika Anda menginstalnya selama proses debug, Anda tidak dapat menggunakan aplikasi yang diinstal kecuali Anda telah memulai IIS Express untuk debugging. Perhatikan juga bahwa PWA tidak dapat diinstal tanpa koneksi https.

menghapus instalasi

Prosedur uninstal sama dengan aplikasi yang diinstal secara biasa. Metode operasi tergantung pada platform target instalasi.

Changelog

2022/7/13

• Menambahkan penjelasan bahwa https diperlukan untuk menginstal PWA.

2022/3/30

• edisi pertama