Présentation du panneau "Application"

Dale St. Marthe
Dale St. Marthe

Utilisez le panneau Application pour inspecter, modifier et déboguer de nombreux aspects de votre application Web, y compris son fichier manifeste, ses service workers, son stockage et ses données de cache.

Présentation

Le panneau Application est divisé en quatre sections contenant des sous-menus. Voici les sections et sous-menus :

Application : contient des informations générales sur l'application, y compris son fichier manifeste, ses service workers et son stockage.

  • L'onglet Manifeste présente les informations de manifest.json de manière conviviale. Le tableau de bord affiche également les erreurs et les avertissements, le cas échéant, dans la section correspondante.
  • L'onglet Service workers (Service workers) vous permet d'inspecter et de déboguer les service workers en émulant des événements push, en mettant à jour un service, etc.
  • L'onglet Stockage contient un graphique à secteurs qui indique la répartition de la mémoire utilisée par le stockage du cache, IndexedDB et les service workers. Vous pouvez également effacer les données des sites et simuler un quota de stockage personnalisé.

Stockage : affichez et modifiez les différentes méthodes de stockage utilisées par une application Web.

  • Les listes Stockage local et Stockage de session vous permettent de sélectionner une origine et de modifier les paires clé-valeur des méthodes de stockage associées.
  • La liste IndexedDB contient des bases de données et vous permet d'inspecter les magasins d'objets depuis le navigateur.
  • La liste Cookies vous permet de sélectionner une origine et de modifier les paires clé-valeur.
  • Les jetons d'état privé et les groupes d'intérêt vous permettent d'inspecter les jetons et les groupes correspondants, le cas échéant.
  • La liste Stockage partagé vous permet de sélectionner une origine, et d'inspecter et de modifier les paires clé-valeur associées.
  • La liste Stockage du cache contient les caches disponibles et vous permet d'inspecter, de filtrer et de supprimer leurs ressources.

Services en arrière-plan : inspectez, testez et déboguez les services en arrière-plan.

  • L'onglet Cache back/forward vous permet d'exécuter des tests sur le cache back/forward dans le navigateur. Il signale également les problèmes qui peuvent empêcher la mise en cache back/forward.
  • L'onglet Récupération en arrière-plan vous permet d'enregistrer l'activité de l'API Background Fetch pendant trois jours maximum.
  • L'onglet Synchronisation en arrière-plan vous permet d'enregistrer l'activité de l'API Background Sync pendant trois jours maximum.
  • L'onglet Mesures d'atténuation du suivi des rebonds vous permet d'identifier et de supprimer l'état des sites qui semblent effectuer un suivi intersites à l'aide de la technique de suivi des rebonds.
  • L'onglet Notifications vous permet d'enregistrer les messages push pendant trois jours maximum.
  • L'onglet Gestionnaire de paiement vous permet d'enregistrer les événements du gestionnaire de paiement pendant trois jours maximum.
  • L'onglet Synchronisation périodique en arrière-plan vous permet d'enregistrer les événements clés pendant trois jours maximum du cycle de vie de la synchronisation périodique en arrière-plan, comme l'enregistrement pour la synchronisation, l'exécution d'une synchronisation en arrière-plan et la désinscription.
  • L'onglet Chargements spéculatifs vous permet de déboguer les chargements spéculatifs. Il affiche l'état spéculatif, les ensembles de règles et les tentatives de chargement spéculatif.
  • L'onglet Messagerie push vous permet d'enregistrer les messages push pendant trois jours maximum et de les consigner.
  • L'onglet API Reporting (API de création de rapports) surveille votre site et signale les appels d'API obsolètes et les failles de sécurité.
  • L'onglet Sessions liées à l'appareil vous permet d'afficher des informations sur les sessions liées à l'appareil et d'inspecter les événements associés.

Frames : divise les pages et les ressources en plusieurs vues, et affiche les informations pertinentes, telles que Sécurité et isolation, Politique de sécurité du contenu, Disponibilité de l'API, etc.

Ouvrir le panneau "Application"

Pour ouvrir le panneau Application :

  1. Ouvrez les outils de développement.
  2. Ouvrez le menu Command (Commande) en appuyant sur :
    • macOS : Commande+Maj+P
    • Windows, Linux, ChromeOS : Ctrl+Maj+P Menu de commandes avec
  3. Commencez à saisir application, sélectionnez Afficher l'application, puis appuyez sur Entrée. Les outils de développement affichent le panneau Application en haut de la fenêtre.

Vous pouvez également ouvrir le panneau Application de différentes manières :

  • Dans la barre d'action en haut de l'écran, cliquez sur Plus de panneaux, puis sélectionnez Application dans la liste déroulante.
  • En haut à droite, sélectionnez Plus d'options > Plus d'outils > Application.