Publier un PWA sur le Microsoft Store

La publication de votre application web progressive (PWA) sur le Microsoft Store offre les avantages suivants :

Pour publier votre PWA sur le Microsoft Store, aucune modification du code n’est requise. Au lieu de cela, vous créez une réservation d’application dans l’Espace partenaires Microsoft, vous empaquetez votre PWA à l’aide de PWA Builder, puis vous soumettez votre package au Microsoft Store. Les sections suivantes expliquent ces étapes.

Voir aussi :

• Prise en main : publier votre première application dans le Microsoft Store

Créer une réservation d’application

Pour soumettre votre application au Microsoft Store, vous utilisez l’Espace partenaires Microsoft.

Pour créer une réservation d’application :

1. Avant de pouvoir créer une réservation d’application, vous devez disposer d’un compte Microsoft personnel (pas un compte Microsoft professionnel ou un compte Microsoft scolaire) inscrit dans le Programme Windows pour les développeurs.

   1. Si vous n’en avez pas déjà un, créez un compte Microsoft personnel sur account.microsoft.com.
   2. Inscrivez-vous au programme Windows Developer en suivant les étapes de la page Ouvrir un compte de développeur dans l’Espace partenaires.

2. Une fois votre compte inscrit dans le programme pour développeurs d’applications, procédez comme suit pour créer une réservation d’application :

   1. Accédez au tableau de bord de l’Espace partenaires. Connectez-vous avec le compte que vous avez inscrit.
   2. Sous Espaces de travail, sélectionnez Applications et jeux. Les applications et les jeux | La page Vue d’ensemble s’affiche.
   3. Sélectionnez Nouvelleapplication MSIX ou PWA de produit>.
   4. Lorsque vous y êtes invité, entrez un nom pour votre réservation, puis sélectionnez Réserver un nom de produit.

   

3. Pour afficher les détails de votre éditeur à utiliser dans la section Packager votre PWA, sélectionnez Gestion des> produitsIdentité du produit.

   

4. Copiez et enregistrez les valeurs suivantes.

   • ID du package
   • ID de l’éditeur
   • Nom complet de l’éditeur

Créer un package de votre PWA pour le Store

Maintenant que vous avez collecté les informations de publication de votre application, générez un package d’application Windows pour votre PWA à l’aide de PWA Builder.

Pour générer un package d’application :

1. Accédez à PWA Builder.

2. Sous Expédier votre PWA aux magasins d’applications, saisissez l’URL de votre PWA dans la zone de texte, puis cliquez sur le bouton Démarrer .

   Votre PWA est évalué pour s’assurer qu’il est prêt pour le Store.

3. Si l’évaluation dans la page de la carte de rapport PWABuilder indique que votre PWA est prêt à être empaqueté, passez à l’étape suivante. Si l’évaluation indique que votre PWA n’est pas prêt à être packagée, examinez la section Éléments d’action pour voir comment améliorer votre PWA :

   

4. Une fois que votre PWA est prêt à être packagé, dans le coin supérieur droit de la page de la carte de rapport PWABuilder, cliquez sur le bouton Package pour les magasins. Une boîte de dialogue s’ouvre et affiche le message « Génial ! » Votre PWA est prêt pour le magasin !

5. Sous Windows, cliquez sur le bouton Générer un package . La boîte de dialogue Options du package Windows s’ouvre.

6. Collez les valeurs suivantes, que vous avez enregistrées dans la section Créer une réservation d’application ci-dessus :

   • ID du package
   • Nom complet de l’éditeur
   • ID de l’éditeur

   

7. Cliquez sur le bouton Télécharger le package pour télécharger votre package Windows.

Votre téléchargement est une .zip archive qui contient un .msixbundle fichier et un .classic.appxbundle fichier. Les deux packages d’application permettent à votre PWA de s’exécuter sur un large éventail de versions de Windows.

Voir aussi :

• Qu’est-ce qu’un package classique ?
• Groupement des packages MSIX.

Soumettre votre package d’application au Microsoft Store

Pour soumettre votre application au Microsoft Store :

1. Accédez à l’Espace partenaires Microsoft.

2. Sélectionnez votre application.

3. Cliquez sur le bouton Commencer votre soumission .

   

4. Lorsque vous y êtes invité, fournissez des informations sur votre application, telles que la tarification et la classification par âge.

5. Dans l’invite Packages , sélectionnez le et les .msixbundle.classic.appxbundle fichiers que vous avez générés dans la section Packager votre PWA .

Une fois l’application envoyée, elle est examinée, généralement dans un délai de 24 à 48 heures. Une fois l’application approuvée, votre PWA est disponible dans le Microsoft Store.

Mesurer l’utilisation de votre PWA installée à partir du Microsoft Store

Lors du lancement initial de votre PWA, si vous l’avez installé à partir du Microsoft Store, Microsoft Edge inclut l’en-tête suivant Referer avec la demande de la première navigation de votre application web.

Referer: app-info://platform/microsoft-store

Utilisez cette fonction pour mesurer un trafic distinct de votre PWA qui a été installé à partir du Microsoft Store. En fonction du trafic, vous pouvez ajuster le contenu de votre application pour améliorer l’expérience utilisateur. Cette fonctionnalité est accessible à la fois au code client et serveur. Pour accéder à ces informations côté client, vous pouvez effectuer une requête document.referrer dans votre code JavaScript.

Rediriger vers des domaines spécifiques aux paramètres régionaux sans afficher d’interface utilisateur supplémentaire

Par défaut, un PWA installé à partir du Microsoft Store affiche une interface utilisateur supplémentaire lorsque l’application est redirigée vers un domaine spécifique aux paramètres régionaux. L’interface utilisateur ajoutée affiche l’URL et le titre de la page. Cette interface utilisateur est ajoutée, car la navigation vers le domaine spécifique aux paramètres régionaux est considérée comme hors étendue.

Lorsqu’un utilisateur se déplace en dehors du champ d’application d’une PWA, l’interface utilisateur suivante est introduite :

Redirection de domaine avec les PWA installés à partir du navigateur

Un manifeste d’application web est lié à un seul domaine. Toutefois, certaines PWA utilisent des domaines spécifiques aux paramètres régionaux pour leurs clients dans des régions spécifiques du globe. Lors de la visite du PWA dans un navigateur web, les clients passent en toute transparence du domaine principal (par exemple, contoso.com) à un domaine spécifique aux paramètres régionaux (par exemple, contoso.co.ke), car la redirection se produit lors du chargement initial de ce site web.

Les clients qui installent le PWA à partir de Microsoft Edge installeront donc le PWA à partir du domaine spécifique aux paramètres régionaux. Les lancements suivants de PWA vont directement au domaine spécifique aux paramètres régionaux, au lieu d’aller d’abord au domaine principal.

Redirection de domaine avec les applications PWA installées à partir du Microsoft Store

Les PWA installées à partir du Microsoft Store ont une URL de démarrage codée en dur qui pointe vers le domaine principal. Lorsque l’application PWA est lancée, elle accède initialement au domaine principal, puis le client peut (si nécessaire) être redirigé vers son domaine spécifique aux paramètres régionaux. Si cette redirection se produit, la navigation est considérée comme « hors champ ». Par conséquent, l’application affiche l’URL et le titre de la page en haut de la page.

L’affichage de l’URL et du titre de la page est une fonctionnalité de sécurité permettant de s’assurer que les utilisateurs savent qu’ils ont quitté le contexte de la PWA. Cette interface utilisateur supplémentaire est logique lorsqu’un utilisateur charge une page à partir d’un autre site web dans le contexte de la PWA. Toutefois, cette interface utilisateur ajoutée peut être inappropriée lorsqu’un utilisateur se déplace entre des domaines qui font tous partie du même site web.

Empêcher l’affichage de l’URL et du titre spécifiques aux paramètres régionaux

Il est actuellement impossible pour les applications installées à partir du Microsoft Store d’empêcher l’affichage de l’URL et de l’interface utilisateur de titre supplémentaires lors de la redirection vers un domaine spécifique aux paramètres régionaux.

À l’avenir, les extensions d’étendue permettront à un PWA de capturer la navigation vers des chemins, des sous-domaines ou même des sites autres que son propre étendue. La fonctionnalité d’extensions d’étendue est en développement actif et n’est pas encore prête à être utilisée. Pour en savoir plus sur l’état de développement de cette fonctionnalité dans Chromium, case activée la fonctionnalité d’extensions d’étendue d’application web sur Chrome Platform Status.

Une fois que la fonctionnalité pourra être utilisée dans Microsoft Edge, nous allons la documenter ici. En attendant, pour en savoir plus sur le fonctionnement des extensions de portée, consultez le document explicatif sur le référentiel WICG.

Apporter des mises à jour à votre application

En règle générale, lorsque vous mettez à jour votre code PWA, vous n’avez pas besoin de créer un package d’application et de le soumettre à nouveau au Microsoft Store . Par exemple, supposons que vous apportez des modifications au code HTML, CSS ou JavaScript frontal de votre application, ou à votre worker du service. La prochaine fois que l’utilisateur lance l’application, les modifications sont téléchargées par le navigateur qui exécute votre application à partir de votre serveur web.

Toutefois, si vous apportez des modifications au fichier manifeste de l’application web, vous devez créer un package d’application et le soumettre à nouveau au Microsoft Store. Par exemple, dans le manifeste, vous pouvez modifier l’icône ou le nom de l’application, ou ajouter des membres de manifeste tels que file_handlers, protocol_handlersou share_target. La création et l’envoi d’un package d’application sont nécessaires lorsque le manifeste est modifié, car les informations contenues dans le fichier manifeste de l’application web sont copiées dans le package d’application Windows, pour une meilleure intégration avec Windows.

Voir aussi

• Microsoft Store
• PWA Builder

Documents dans le référentiel PWA Builder :

• Étapes suivantes pour faire entrer votre PWA dans le Microsoft Store : testez et envoyez votre package d’application PWA.
• Publier une nouvelle application sur le Store
• Mettre à jour une application existante dans le Store - Mettez à jour une application du Store existante vers un PWA.
• Recommandations d’images pour les packages Windows PWA - Recommandations d’images pour les PWA dans le Windows Store.
• Qu’est-ce qu’un package classique ? - Explication de l’emballage de l’application.