Présentation du panneau "Application"

Dale St. Marthe
Dale St. Marthe

Le panneau Application vous permet d'inspecter, de modifier et de déboguer de nombreux aspects de votre application Web, y compris son fichier manifeste, les service workers, les données de stockage et de cache.

Présentation

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

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

  • L'onglet Manifest présente les informations de manifest.json de manière conviviale. Il affiche également les erreurs et les avertissements, le cas échéant, dans la section correspondante.
  • L'onglet Service workers vous permet d'inspecter et de déboguer les service workers en émulant des événements d'envoi, en mettant à jour un service, etc.
  • L'onglet Storage (Stockage) contient un graphique à secteurs indiquant la répartition de la mémoire utilisée par le stockage en cache, par IndexedDB et par 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 de stockage local et de 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 dans le navigateur.
  • La liste Cookies vous permet de sélectionner une origine et de modifier les paires clé-valeur.
  • Les jetons d'état privés et les groupes de centres 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, puis d'inspecter et de modifier les paires clé-valeur associées.
  • La liste Espace de stockage du cache contient les caches disponibles et vous permet d'inspecter, de filtrer et de supprimer leurs ressources.

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

  • L'onglet Cache amélioré vous permet d'exécuter des tests sur le cache amélioré dans le navigateur. Il signale également les problèmes qui peuvent empêcher la mise en cache avancée.
  • L'onglet Récupération en arrière-plan vous permet d'enregistrer l'activité à partir 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 de synchronisation en arrière-plan 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 de gestionnaire de paiements pendant une durée maximale de trois jours.
  • L'onglet Synchronisation périodique en arrière-plan vous permet d'enregistrer des événements clés pendant un maximum de trois jours dans le cycle de vie de la synchronisation périodique en arrière-plan (par exemple, inscription à la synchronisation, synchronisation en arrière-plan et annulation de l'enregistrement).
  • L'onglet Chargements spéculatifs vous permet de déboguer les chargements spéculatifs. Il indique l'état spéculatif, les jeux de règles et les tentatives de chargement spéculatifs.
  • L'onglet Messages push vous permet d'enregistrer les messages push pendant trois jours maximum, puis de les consigner.
  • L'onglet API Reporting surveille votre site et signale les appels d'API obsolètes et les cas de non-respect de la sécurité.

Frames: divise les pages et les ressources en plusieurs vues, et affiche les informations pertinentes, telles que Sécurité et isolation, Content Security Policy, 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 Commande en appuyant sur :
    • macOS: Commande+Maj+P
    • Windows, Linux, ChromeOS: Ctrl+Maj+P Menu de commandes avec
  3. Commencez à saisir application, sélectionnez Show Application (Afficher l'application), puis appuyez sur Entrée. Le panneau Application s'affiche en haut de la fenêtre des outils de développement.

Vous pouvez également ouvrir le panneau Application comme suit:

  • Dans la barre d'action située en haut, cliquez sur double_arrow (flèche vers le bas) Plus de panneaux, puis sélectionnez Application dans la liste déroulante.
  • En haut à droite, sélectionnez more_vert Plus d'options > Plus d'outils > Application.