Anwendungsbereich – Übersicht

Dale St. Marthe
Dale St. Marthe
LinkedIn

Im Bereich Anwendung können Sie viele Aspekte Ihrer Web-App untersuchen, ändern und debuggen, darunter das Manifest, Service-Worker, Speicher und Cache-Daten.

Übersicht

Der Bereich Anwendung ist in vier Abschnitte mit Untermenüs unterteilt. Im Folgenden sind diese Abschnitte und Untermenüs aufgeführt:

Anwendung: Enthält allgemeine Informationen zur App, einschließlich Manifest, Service-Worker und Speicher.

  • Auf dem Tab Manifest werden Informationen aus manifest.json benutzerfreundlich dargestellt. Außerdem werden Fehler und Warnungen im entsprechenden Abschnitt angezeigt.
  • Auf dem Tab Service-Worker können Sie Service-Worker untersuchen und debuggen, indem Sie Push-Ereignisse emulieren, einen Dienst aktualisieren und vieles mehr.
  • Der Tab Speicher enthält ein Kreisdiagramm, das die Verteilung des von Cache-Speicher, IndexedDB und Service-Workern verwendeten Arbeitsspeichers zeigt. Sie können auch Websitedaten löschen und ein benutzerdefiniertes Speicherkontingent simulieren.

Speicher: Hier können Sie die verschiedenen Speichermethoden ansehen und bearbeiten, die von einer Web-App verwendet werden.

  • In den Listen Lokaler Speicher und Sitzungsspeicher können Sie einen Ursprung auswählen und die Schlüssel/Wert-Paare der zugehörigen Speichermethoden bearbeiten.
  • Die Liste IndexedDB enthält Datenbanken und ermöglicht es Ihnen, Objektspeicher im Browser zu untersuchen.
  • In der Liste Cookies können Sie einen Ursprung auswählen und die Schlüssel/Wert-Paare bearbeiten.
  • Private State Tokens und Interessengruppen können Sie die entsprechenden Tokens und Gruppen untersuchen, falls vorhanden.
  • In der Liste Gemeinsamer Speicher können Sie einen Ursprung auswählen und die zugehörigen Schlüssel/Wert-Paare untersuchen und bearbeiten.
  • Die Liste Cache-Speicher enthält verfügbare Caches und ermöglicht es Ihnen, deren Ressourcen zu untersuchen, zu filtern und zu löschen.

Hintergrunddienste: Hier können Sie Hintergrunddienste untersuchen, testen und debuggen.

  • Auf dem Tab Back-Forward-Cache können Sie Tests für den Back-Forward-Cache im Browser ausführen. Außerdem werden Probleme gemeldet, die das Back-Forward-Caching verhindern können.
  • Auf dem Tab Hintergrundabruf können Sie bis zu drei Tage lang Aktivitäten aus der Background Fetch API aufzeichnen.
  • Auf dem Tab Hintergrundsynchronisierung können Sie bis zu drei Tage lang Aktivitäten aus der Background Sync API aufzeichnen.
  • Auf dem Tab Eindämmung von Bounce-Tracking können Sie den Status von Websites identifizieren und löschen, die anscheinend websiteübergreifendes Tracking mit der Bounce-Tracking-Technik durchführen.
  • Auf dem Tab Benachrichtigungen können Sie bis zu drei Tage lang Push-Nachrichten aufzeichnen.
  • Auf dem Tab Zahlungshandler können Sie bis zu drei Tage lang Ereignisse des Zahlungshandlers aufzeichnen.
  • Auf dem Tab Regelmäßige Hintergrundsynchronisierung können Sie bis zu drei Tage lang wichtige Ereignisse im Lebenszyklus der regelmäßigen Hintergrundsynchronisierung aufzeichnen, z. B. die Registrierung für die Synchronisierung, die Durchführung einer Hintergrundsynchronisierung und die Aufhebung der Registrierung.
  • Auf dem Tab Spekulative Ladevorgänge können Sie spekulative Ladevorgänge debuggen. Dort werden der spekulative Status, Regelsätze und Versuche zum spekulativen Laden angezeigt.
  • Auf dem Tab Push-Messaging können Sie bis zu drei Tage lang Push-Nachrichten aufzeichnen und protokollieren.
  • Auf dem Tab Reporting API wird Ihre Website überwacht und es werden veraltete API-Aufrufe und Sicherheitsverstöße gemeldet.
  • Auf dem Tab Gerätegebundene Sitzungen können Sie Informationen zu gerätegebundenen Sitzungen ansehen und zugehörige Ereignisse untersuchen.

Frames: Teilt Seiten und Ressourcen in mehrere Ansichten auf und zeigt relevante Informationen an, z. B. Sicherheit und Isolation, Content Security Policy und API-Verfügbarkeit.

Bereich „Anwendung“ öffnen

So öffnen Sie den Bereich Anwendung:

  1. Öffnen Sie die Entwicklertools.
  2. Öffnen Sie das Befehlsmenü mit folgender Tastenkombination:
    • macOS: Command+Shift+P
    • Windows, Linux, ChromeOS: Control+Shift+P Befehlsmenü mit
  3. Geben Sie application ein, wählen Sie Anwendung anzeigen aus und drücken Sie die Eingabetaste. In den Entwicklertools wird der Bereich Anwendung oben im Entwicklertools-Fenster angezeigt.

Alternativ können Sie den Bereich Anwendung auch so öffnen:

  • Klicken Sie in der Aktionsleiste oben auf Weitere Bereiche und wählen Sie in der Drop-down-Liste Anwendung aus.
  • Wählen Sie rechts oben Weitere Optionen > Weitere Tools > Anwendung aus.