Fehler bei Hintergrunddiensten beheben

Kayce Basques
Kayce Basques
Sofia Emelianova
Sofia Emelianova

Der Bereich Hintergrunddienste in den Chrome-Entwicklertools enthält eine Sammlung von Tools für die JavaScript-APIs, mit denen Ihre Website Updates senden und empfangen kann, auch wenn ein Nutzer Ihre Website nicht geöffnet hat. Ein Hintergrunddienst ist funktional ähnlich einem Hintergrundprozess.

Im Bereich Hintergrunddienste können Sie die folgenden Hintergrunddienste debuggen:

Chrome DevTools kann Fetch-, Synchronisierungs- und Benachrichtigungsereignisse für drei Tage protokollieren, auch wenn DevTools nicht geöffnet ist. So können Sie prüfen, ob Ereignisse wie erwartet gesendet und empfangen werden.

Zusätzlich zu Ereignissen im Hintergrunddienst können die Entwicklertools:

Hintergrundabruf

Mit der Background Fetch API kann ein Service Worker große Ressourcen wie Filme oder Podcasts zuverlässig als Hintergrunddienst herunterladen. So protokollieren Sie Hintergrundabrufereignisse für drei Tage, auch wenn DevTools nicht geöffnet ist:

  1. Öffnen Sie die Entwicklertools auf einer Seite, die die Background Fetch API verwendet.
  2. Gehen Sie zu Anwendung > Hintergrunddienste > Hintergrundabruf und klicken Sie auf Aufzeichnen Aufzeichnen.

    Der Bereich „Hintergrundabruf“.

  3. Lösen Sie auf Ihrer Seite einige Hintergrundabrufaktivitäten aus. DevTools protokolliert die Ereignisse in der Tabelle.

    Ein Protokoll der Ereignisse im Bereich „Hintergrundabruf“.

  4. Klicken Sie auf ein Ereignis, um die zugehörigen Details im Bereich unter der Tabelle aufzurufen.

  5. Sie können DevTools schließen und die Aufzeichnung bis zu drei Tage lang laufen lassen. Klicken Sie auf Anhalten. Beenden, um die Aufnahme zu beenden.

Hintergrundsynchronisierung

Mit der Background Sync API kann ein Service Worker Daten an einen Server senden, sobald er wieder eine zuverlässige Internetverbindung hergestellt hat. So protokollieren Sie Hintergrundsynchronisierungsereignisse für drei Tage, auch wenn DevTools nicht geöffnet ist:

  1. Öffnen Sie die Entwicklertools, z. B. auf dieser Demoseite.
  2. Gehen Sie zu Anwendung > Hintergrunddienste > Hintergrundsynchronisierung und klicken Sie auf Aufzeichnen Aufzeichnen.

    Der Bereich „Hintergrundsynchronisierung“.

  3. Klicken Sie auf der Demoseite auf Register background sync (Hintergrundsynchronisierung registrieren), um den entsprechenden Service Worker zu registrieren, und klicken Sie bei Aufforderung auf Allow (Zulassen).

    Die Registrierung von Service Workern ist eine Hintergrundsynchronisierungsaktivität. DevTools protokolliert die Ereignisse in der Tabelle.

    Ein Protokoll der Ereignisse im Bereich „Hintergrundsynchronisierung“.

  4. Klicken Sie auf ein Ereignis, um die zugehörigen Details im Bereich unter der Tabelle aufzurufen.

  5. Sie können DevTools schließen und die Aufzeichnung bis zu drei Tage lang laufen lassen. Klicken Sie auf Anhalten. Beenden, um die Aufnahme zu beenden.

(Experimentell) Eindämmung von Bounce-Tracking

Mit dem Experiment zur Eindämmung von Bounce-Tracking in Chrome können Sie den Status von Websites, die anscheinend websiteübergreifendes Tracking mithilfe der Bounce-Tracking-Technik durchführen, identifizieren und löschen. Sie können die Maßnahmen zur Eindämmung des Trackings manuell erzwingen und sich eine Liste der Websites ansehen, deren Status gelöscht wurde.

So erzwingen Sie die Eindämmung von Tracking:

  1. Drittanbieter-Cookies in Chrome blockieren Gehen Sie zu Dreipunkt-Menü > Einstellungen > Sicherheit Datenschutz und Sicherheit > Cookies und andere Websitedaten > Optionsfeld ist ausgewählt. Drittanbieter-Cookies blockieren und aktivieren Sie die Option.
  2. Legen Sie in chrome://flags den Test Eindämmung von Bounce-Tracking auf Aktiviert mit Löschung fest.
  3. Öffnen Sie die Entwicklertools und gehen Sie zu Anwendung > Hintergrunddienste > Maßnahmen zur Eindämmung von Bounce-Tracking.
  4. Klicken Sie auf einen Bounce-Link und warten Sie 10 Sekunden, bis Chrome den Bounce erfasst hat. Auf dem Tab Probleme werden Sie vor dem bevorstehenden Löschen des Status gewarnt.
  5. Klicken Sie auf Force run (Ausführung erzwingen), um den Status sofort zu löschen.

In der Liste der Eindämmungsmaßnahmen für Bounce-Tracking wird ein Status gelöscht.

Benachrichtigungen

Nachdem ein Service Worker eine Push-Nachricht von einem Server empfangen hat, verwendet er die Notifications API, um die Daten für einen Nutzer anzuzeigen. So protokollieren Sie Benachrichtigungen für drei Tage, auch wenn die Entwicklertools nicht geöffnet sind:

  1. Entwicklertools öffnen
  2. Gehen Sie zu Anwendung > Hintergrunddienste > Benachrichtigungen und klicken Sie auf Aufzeichnen Aufzeichnen.

    Die Benachrichtigungsleiste

  3. Klicken Sie auf Benachrichtigung planen und dann auf Zulassen, wenn Sie dazu aufgefordert werden.

  4. Warte, bis die Benachrichtigung angezeigt wird. DevTools protokolliert die Benachrichtigungsereignisse in der Tabelle.

    Ein Protokoll der Ereignisse im Benachrichtigungsbereich.

  5. Klicken Sie auf ein Ereignis, um die zugehörigen Details im Bereich unter der Tabelle aufzurufen.

  6. Sie können DevTools schließen und die Aufzeichnung bis zu drei Tage lang laufen lassen. Klicken Sie auf Anhalten. Beenden, um die Aufnahme zu beenden.

Spekulative Ladevorgänge

Spekulative Ladevorgänge ermöglichen ein nahezu sofortiges Laden von Seiten basierend auf Spekulationsregeln, die Sie definieren. So kann Ihre Website die meisten aufgerufenen Seiten vorab abrufen und rendern.

Beim Prefetching wird eine Ressource im Voraus abgerufen. Beim Prerendering geht man noch einen Schritt weiter und rendert die gesamte Seite in einem verborgenen Hintergrund-Renderingprozess.

Sie können spekulative Ladevorgänge im Bereich Anwendung > Hintergrunddienste > Spekulative Ladevorgänge debuggen. Der Bereich enthält drei Ansichten:

  • Spekulative Ladevorgänge Enthält den spekulativen Status für die aktuelle Seite, die aktuelle URL, Seiten, die die aktuelle Seite spekulativ zu laden versucht, und deren Status.
  • Regeln Enthält die Regelsätze auf der aktuellen Seite im Bereich Elemente und den Gesamtstatus der Spekulationen.
  • Spekulationen: Enthält eine Tabelle mit Informationen zu Versuchen zum spekulativen Laden und deren Status. Wenn ein Versuch fehlgeschlagen ist, können Sie in der Tabelle darauf klicken, um detaillierte Informationen und den Grund für den Fehler aufzurufen.

So können Sie spekulatives Laden auf dieser Prerender-Demoseite debuggen:

  1. Öffnen Sie die DevTools auf der Seite und gehen Sie zu Anwendung > Hintergrunddienste > Spekulative Ladevorgänge. Wenn Sie keine spekulativen Ladevorgänge sehen, die von der Seite initiiert wurden, laden Sie sie neu.

    Die von dieser Seite spekulativ geladenen URLs, zwei Erfolge und ein Fehler.

  2. Die Startseite der Demo rendert zwei Seiten vorab, bei einer Seite schlägt das Pre-Rendering fehl. Klicken Sie auf Alle Spekulationen ansehen.

  3. Wählen Sie unter Spekulationen die Spekulation mit dem Status Fehler aus, um unten den Abschnitt Fehlergrund mit detaillierten Informationen aufzurufen.

    Die fehlgeschlagene Spekulation wurde ausgewählt.

    In diesem Fall ist das Pre-Rendering fehlgeschlagen, weil es auf der Website keine /next3.html-Seite gibt.

  4. Öffnen Sie den Bereich Regeln und klicken Sie auf Status, um den Regelsatz unten aufzurufen. Wenn Sie auf den Link Regelsatz klicken, gelangen Sie zum Steuerfeld Elemente und sehen, wo die Spekulationsregel definiert ist.

    Der Bereich „Regeln“ mit dem Link zum Regelsatz.

Eine ausführlichere Anleitung finden Sie unter Spekulationsregeln debuggen.

Push-Benachrichtigungen

Damit einem Nutzer eine Push-Benachrichtigung angezeigt werden kann, muss ein Service Worker zuerst die Push Message API verwenden, um Daten von einem Server zu empfangen. Wenn der Service Worker bereit ist, die Benachrichtigung anzuzeigen, verwendet er die Notifications API. So protokollieren Sie Push-Nachrichten drei Tage lang, auch wenn DevTools nicht geöffnet ist:

  1. Öffnen Sie die Entwicklertools, z. B. auf dieser Demoseite.
  2. Gehen Sie zu Anwendung > Hintergrunddienste > Push-Messaging und klicken Sie auf Aufzeichnen Aufzeichnen.

    Der Bereich „Benachrichtigungen im Push-Verfahren“.

  3. Aktivieren Sie auf der Demoseite Push-Benachrichtigungen aktivieren, klicken Sie auf Zulassen, wenn Sie dazu aufgefordert werden, geben Sie eine Nachricht ein und senden Sie sie. DevTools protokolliert Push-Benachrichtigungsereignisse in der Tabelle.

    Ein Protokoll von Ereignissen im Bereich „Push-Benachrichtigungen“.

  4. Klicken Sie auf ein Ereignis, um die zugehörigen Details im Bereich unter der Tabelle aufzurufen.

  5. Sie können DevTools schließen und die Aufzeichnung bis zu drei Tage lang laufen lassen. Klicken Sie auf Anhalten. Beenden, um die Aufnahme zu beenden.

Reporting API

Einige Fehler treten nur in der Produktion auf. Sie sehen sie nie lokal oder während der Entwicklung, da echte Nutzer, Netzwerke und Geräte das Spiel verändern.

Angenommen, Ihre neue Website basiert auf Drittanbietersoftware, die document.write() verwendet, um wichtige Skripts zu laden. Neue Nutzer auf der ganzen Welt öffnen Ihre Website, haben aber möglicherweise langsamere Verbindungen als Sie beim Testen. Ohne dass Sie es wissen, funktioniert Ihre Website für sie nicht mehr, weil Chrome bei document.write() in langsamen Netzwerken eingreift. Alternativ können Sie auch nach APIs suchen, die in Ihrer Codebasis verwendet werden und die eingestellt wurden oder demnächst eingestellt werden.

Die Reporting API wurde entwickelt, um Ihnen bei der Überwachung von eingestellten API-Aufrufen, Sicherheitsverstößen auf Ihrer Seite und mehr zu helfen. Sie können die Berichterstellung wie unter Webanwendung mit der Reporting API überwachen beschrieben einrichten.

So rufen Sie die von einer Seite generierten Berichte auf:

  1. Rufen Sie chrome://flags/#enable-experimental-web-platform-features auf, stellen Sie Experimentelle Webplattformfunktionen auf Aktiviert ein und starten Sie Chrome neu.
  2. Öffnen Sie die DevTools und rufen Sie Anwendung > Hintergrunddienste > Reporting API auf.

    In der Reporting API aufgeführte Berichte

Der Tab Reporting API ist in drei Bereiche unterteilt:

  • Die Tabelle Berichte enthält die folgenden Informationen zu jedem Bericht:
    • URL, die die Berichterstellung ausgelöst hat
    • Art des Verstoßes
    • Berichtstatus
    • Zielendpunkt
    • Zeitstempel Generiert am
    • Body melden
  • Der Vorschauabschnitt Berichtstext. Wenn Sie sich den Hauptteil eines Berichts in der Vorschau ansehen möchten, klicken Sie in der Tabelle auf einen Bericht.
  • Der Bereich Endpunkte mit einer Übersicht aller in der Reporting-Endpoints-Kopfzeile konfigurierten Endpunkte.

Berichtsstatus

In der Spalte Status sehen Sie, ob Chrome den Bericht erfolgreich gesendet hat, ihn gerade sendet oder ob der Vorgang fehlgeschlagen ist.

Status Beschreibung
Success Der Browser hat den Bericht gesendet und der Endpunkt hat mit einem Erfolgscode (200 oder einem anderen Erfolgscode 2xx) geantwortet.
Pending Der Browser versucht, den Bericht zu senden.
Queued Der Bericht wurde generiert und der Browser versucht noch nicht, ihn zu senden. Ein Bericht wird in einem der folgenden beiden Fälle als Queued angezeigt:
  • Der Bericht ist neu und der Browser wartet ab, ob weitere Berichte eingehen, bevor er versucht, ihn zu senden.
  • Der Bericht ist nicht neu. Der Browser hat bereits versucht, ihn zu senden, was fehlgeschlagen ist. Er wartet, bevor er es noch einmal versucht.
MarkedForRemoval Nachdem der Browser eine Weile versucht hat, den Bericht zu senden (Queued), wird er bald aus der Liste der zu sendenden Berichte entfernt.

Berichte werden nach einer Weile entfernt, unabhängig davon, ob sie erfolgreich gesendet wurden.