Créer une application web progressive qui peut être installée et exécutée sur chaque client

environnement

Visual Studio

• Visual Studio 2019

.NET

• .NET 5.0

Qu’est-ce qu’une progressive Web App (PWA) ?

En termes simples, il s’agit d’une application qui vous permet d’installer et d’utiliser des applications Web sur chaque appareil tel qu’un PC Windows, un iPhone ou Android.

La réalité de Blazor WebAssembly est un WebAssembly standardisé lui-même, de sorte que l’implémentation ci-dessus est possible. Il est essentiellement basé sur des applications Web, mais vous pouvez également utiliser des fonctionnalités natives telles que les notifications push dans Plus Alpha.

La procédure d’installation pour l’utilisateur est également très simple, car il suffit de visiter la page cible et d’appuyer sur le bouton d’installation.

Création d’un projet PWA Blazor WebAssembly

C’est fondamentalement la même chose que de créer un projet Blazor WebAssembly.

Créez simplement le projet comme vous le feriez normalement, et lorsque vous arrivez à l’écran « Informations supplémentaires » ci-dessous, cochez simplement « Application Web progressive ».

Mis à part les fonctionnalités spécifiques à PWA, le développement Blazor WebAssembly est essentiellement le même que le modèle sans PWA.

Différences par rapport aux projets non PWA

Lorsque vous créez un projet dans PWA, vous obtenez quelques fichiers supplémentaires.

En outre, lorsque vous ouvrez ,index.html du code est ajouté qui fait référence à ces fichiers.

Essayez une PWA

Exécutez le projet pour le débogage.

L’exemple d’exécution est exactement le même que le modèle sans PWA, mais lorsqu’il est exécuté avec PWA, vous pouvez voir qu’un bouton d’installation a été ajouté au navigateur Web.

Lorsque vous cliquez dessus, une confirmation d’installation s’affiche, je vais donc essayer d’installer.

Cela ouvrira une fenêtre séparée dans laquelle vous pourrez exécuter l’application Blazor. Il agit comme une application cliente, pas un navigateur Web, de sorte que vous pouvez également configurer les paramètres liés au système d’exploitation comme indiqué dans la figure.

Comme il est installé, il sera enregistré dans le menu Démarrer comme celui-ci et vous pourrez le démarrer.

Toutefois, étant donné que le contenu est une application web, il ne peut pas être utilisé à moins qu’il n’y ait un serveur qui peut télécharger le contenu. Par exemple, si vous l’installez pendant une exécution de débogage, vous ne pouvez pas utiliser l’application installée à moins d’avoir démarré IIS Express pour le débogage. Notez également que les PWA ne peuvent pas être installés sans connexion https.

désinstaller

La procédure de désinstallation est la même que pour une application installée normalement. La méthode de fonctionnement dépend de la plate-forme cible de l’installation.

Journal des modifications

2022/7/13

• Ajout d’une explication selon laquelle https est requis pour installer PWA.

2022/3/30

• première édition