Single-Page-Anwendungen messen

Dieses Dokument richtet sich an Entwickler, die Seitenaufrufe in ihrer einseitigen Web-App mit Google Analytics erfassen möchten.

Einseitige Web-Apps (Single-Page Applications, SPAs) sind Websites, bei denen ein HTML-Dokument einmal geladen wird. Alle zusätzlichen Inhalte werden über JavaScript APIs abgerufen.

Beispiel: Sie haben ein Formular, um Leads zu generieren. Das Formular besteht aus drei Bildschirmen:

  • Erster Bildschirm zum Erfassen der Kundeninformationen
  • Zweiter Bildschirm, auf dem Kunden ihr Interesse an bestimmten Diensten angeben
  • Dritter Bildschirm, auf dem sich Kunden für Webinare zu ihren Interessen anmelden können

Um Seitenaufrufe von SPAs korrekt zu erfassen, müssen Sie die Seitenaufrufe für jeden Bildschirm zählen, mit dem ein Nutzer interagiert, und den Seiten Referrer richtig erfassen, damit Sie den Weg des Nutzers korrekt nachvollziehen können.

Hinweis

Auf dieser Seite wird davon ausgegangen, dass Sie bereits Folgendes haben:

  • Ein Google Analytics 4-Konto und eine Property für Ihre Website Informationen zum Einrichten von Google Analytics .

  • Ein Google-Tag, das auf Ihrer Website implementiert ist und ausgelöst wird, wenn die Seite zum ersten Mal geladen wird Informationen zum Einrichten des Google-Tags .

Erfassung für einseitige Web-Apps implementieren

Wenn Sie SPAs genau erfassen möchten, verwenden Sie eine der folgenden Methoden, um einen neuen virtuellen Seitenaufruf auszulösen:

  • Änderungen am Browserverlauf (empfohlen): Verwenden Sie diese Option, wenn Ihre SPA die History API verwendet, insbesondere die pushState() und replaceState() Methode, um Bildschirme zu aktualisieren.

  • Benutzerdefinierte Ereignisse: Verwenden Sie diese Option, wenn Ihre Website das DocumentFragment -Objekt verwendet, um verschiedene Bildschirme zu rendern.

Implementierung von Änderungen am Browserverlauf

Wenn Ihre SPA die History API verwendet, können Sie in Google Analytics optimierte Analysen aktivieren, um Seitenaufrufe automatisch basierend auf Ereignissen im Browserverlauf zu erfassen.

Optimierte Analysen in GA4 aktivieren

So erfassen Sie page_views automatisch basierend auf dem Browserverlauf:

  1. Öffnen Sie Google Analytics.

  2. Klicken Sie auf der Seite Verwaltung unter Datenerhebung und ‑änderung auf Datenstreams > Web.

  3. Stellen Sie den Schieberegler unter Optimierte Analysen auf Ein, um alle Optionen zu aktivieren.

  4. Klicken Sie, um einzelne Optionen zu bearbeiten. Klicken Sie unter Seitenaufrufe auf Erweiterte Einstellungen anzeigen. Achten Sie darauf, dass sowohl Seitenaufrufe als auch Seitenänderungen basierend auf Ereignissen im Browserverlauf aktiviert sind.

    Bild mit der Einstellung für Seitenaufrufe

  5. Speichern Sie die Änderungen.

Hinweis:Wenn optimierte Analysen für „Seitenänderungen basierend auf Ereignissen im Browserverlauf“ aktiviert sind, erfasst Google Analytics automatisch Ereignisse im Browserverlauf (z. B. solche, die in SPAs verwendet werden) und sendet page_view-Ereignisse. Sie müssen in Google Tag Manager keine bestimmten Verlaufsvariablen oder ‑trigger konfigurieren, um Seitenaufrufe an GA4 zu senden.

Google Tag Manager-Trigger für Ereignisse im Browserverlauf verwenden

Wenn Sie in Google Tag Manager andere Arten von Tags basierend auf Änderungen am Browserverlauf auslösen müssen, z. B. um Daten an andere Marketingplattformen zu senden, können Sie den Triggertyp „Änderung des Verlaufs“ verwenden.

Achten Sie beim Konfigurieren von Tags oder Variablen für die Verwendung mit dem Trigger „Änderung des Verlaufs“ darauf, dass Sie die richtigen integrierten Variablen verwenden, die von Google Tag Manager bereitgestellt werden:

  • History New URL Fragment: Das Fragment der URL nach dem Ereignis im Browserverlauf.
  • History Old URL Fragment: Das Fragment der URL vor dem Ereignis im Browserverlauf.
  • History New State: Das neue Verlaufsobjekt.
  • History Old State: Das alte Verlaufsobjekt.
  • History Source: Die Quelle des Ereignisses im Browserverlauf (z. B. popstate, pushState, replaceState).

Diese integrierten Variablen müssen möglicherweise zuerst in Google Tag Manager unter Variablen > Konfigurieren aktiviert werden.

Weitere Informationen zu diesem Trigger finden Sie unter Trigger „Änderung des Verlaufs“.

Erfassungseinrichtung überprüfen

So prüfen Sie, ob Ihre einseitige Web-App Seitenaufrufe korrekt erfasst:

  1. Aktivieren Sie den Debug-Modus für jedes Tag in Ihrer Erfassungseinrichtung für einseitige Web-Apps. Informationen zum Beobachten von Ereignissen in der Debugging-Ansicht (DebugView)

  2. Klicken Sie sich durch Ihre einseitige Web-App. Wenn Sie auf einen neuen virtuellen Bildschirm klicken, sollte in DebugView ein neues page_view-Ereignis angezeigt werden. Vergleichen Sie die page_view-Ereignisparameter mit dem vorherigen page_view-Ereignis, um zu prüfen, ob der Seiten-Referrer und der Seitenstandort korrekt aktualisiert wurden.

Auswirkungen auf automatische Ereignisse

Wenn Sie die Erfassung virtueller Seitenaufrufe in Ihrer SPA korrekt implementieren, werden andere automatische Ereignisse in Google Analytics entsprechend verarbeitet. Wenn virtuelle Seitenaufrufe für Bildschirmänderungen nicht erfasst werden, behandelt Google Analytics die SPA als eine einzelne Seite, was zu verzerrten Messwerten führt.

Mit dem Ereignis user_engagement wird beispielsweise die Zeit erfasst, die ein Nutzer aktiv auf einer Seite verbringt. Ohne virtuelle Seitenaufrufe wird die gesamte Zeit auf der Seite dem ersten Laden der Seite zugeschrieben. So lässt sich nicht analysieren, wie viel Zeit auf einzelnen Bildschirmen verbracht wird.

Wenn die Erfassung virtueller Seitenaufrufe korrekt implementiert ist, gilt Folgendes:

  • Das Ereignis user_engagement wird gesendet, wenn der Nutzer von einer virtuellen Seite zu einer anderen wechselt.
  • Die Zeit auf der vorherigen virtuellen Seite wird berechnet und zusammen mit dem Ereignis user_engagement gesendet, in der Regel kurz bevor das Ereignis page_view für die neue virtuelle Seite verarbeitet wird.
  • Andere Ereignisse wie Klicks oder Scrollen werden mit der page_location der virtuellen Seite verknüpft, die der Nutzer gerade ansieht.

So können Sie die Nutzerinteraktion und andere Messwerte für einzelne Bildschirme oder Bereiche in Ihrer SPA analysieren und so ein genaueres Bild des Wegs des Nutzers erhalten.