Single-Page-Webanwendung
Was finden Sie hier?
Informationen zu Einzelseitenanwendungen
Single-Page-Anwendungen (SPA) sind eine spezielle Art von Web-App. Eine SPA lädt eine einzelne Seite, wenn Sie eine Website aufrufen, und ab diesem Zeitpunkt alle nachfolgenden Inhalte auf derselben Seite, auf der Sie navigieren. Dies scheint wie eine normale Website zu funktionieren, aber wenn Sie zwischen „Seiten“ wechseln, wird die Seite nicht neu geladen.
Standardmäßig wird Bereitstellungscode ausgeführt, sobald eine Webseite geladen wird. Da SPAs jedoch bei der Navigation zwischen Seiten nicht aktualisiert werden, wird Bereitstellungscode nicht neu ausgewertet, wenn Sie zwischen Seiten navigieren. Mit den unten beschriebenen Techniken können Sie den Bereitstellungscode so aktivieren, dass er nahtlos auf Ihrer SPA-Website funktioniert.
TIPP: Einige dieser Techniken verwenden die Website Feedback JavaScript API. Eine ausführliche Dokumentation der JavaScript API für Qualtrics Website Erkenntnisse finden Sie auf dieser Seite.
Achtung: Für die Implementierung der folgenden Dokumentation sind Programmierkenntnisse erforderlich. Wir empfehlen, diese Informationen an das Team zu übergeben, das Ihren Bereitstellungscode implementiert. Unser Support bietet keine Hilfe oder Beratung im Zusammenhang mit benutzerdefinierter Codeerstellung. Stattdessen können Sie sich gerne in unserer engagierte Benutzer-Community erkundigen. Wenn Sie mehr über unsere benutzerdefinierten Coding-Services erfahren möchten, die Sie in Anspruch nehmen können, Kontakt Ihr Qualtrics Benutzerkonto.
Tipp: Javascript ist nicht in allen Qualtrics enthalten. Wenden Sie sich an Ihr Qualtrics Benutzerkonto wenn Sie Zugriff erhalten möchten.
Erneute Beurteilung der Intercept-Logik und Verfolgung der Aktivität bei URL-Änderung
Wenn Ihre Single-Page-Anwendung für die Benutzernavigation auf Client-seitiges Routing angewiesen ist, können Sie eine erneute Beurteilung der Intercepts bei nachfolgenden URL-Änderungen erzwingen, indem Sie die Einstellung Re-evaluate intercept logic when the URL changes aktivieren. Wenn Sie diese Einstellung aktivieren, kann die Intercept zusätzlich zu der Auswertung ausgewertet werden, die beim ersten Laden der Seite erfolgt.
TIPP: Diese Einstellung wirkt sich auf alle Intercepts des Projekts aus.
Achtung: Wenn Sie diese SPA-Einstellung in Verbindung mit der Intercept-Level-Option verwenden möchten, um Anzeige mit benutzerdefiniertem JavaScript-Code (manuell), dann müssen Sie weiterhin die
QSI.API.run();Methode, um das Intercept abzurufen.
Manuell mit API implementieren
Tipp: Eine detaillierte Dokumentation zur API für Feedback zur Qualtrics finden Sie unter. diese Seite.
Diese Methode beschreibt, wie Sie Ihren Bereitstellungscode auf manuelle Ausführung umstellen. Das bedeutet, dass der Bereitstellungscode die zugehörigen Logik bis die entsprechende API initiiert wird.
Manuell einzuspielen
API
Tipp: Eine detaillierte Dokumentation zur API für Feedback zur Qualtrics finden Sie unter. diese Seite.
Wenn Sie möchten, dass Qualtrics Ihr Projekt in einer einzigen Instanz bewertet, verwenden Sie die folgenden beiden Anfragen:
Wenn Qualtrics Ihren Projektcode mehrmals auf derselben Seite auswerten soll, wiederholen Sie jedes Mal die folgenden drei Schritte:
FAQs
Ich habe mein Intercept aktiviert, aber es wird auf meiner Website nicht angezeigt. Warum nicht?
Ich habe mein Intercept aktiviert, aber es wird auf meiner Website nicht angezeigt. Warum nicht?
- Logik: Die Targeting-Logik und der Aktionssatzfür Intercepts sind die Bedingungen, die erfüllt sein müssen, damit einem Besucher ein Intercept angezeigt wird. Die Überprüfung dieser Logik ist hilfreich, um zu entdecken, warum das Intercept nicht auf einer Seite angezeigt wird.
- Logiksätze, die „Enthält“ verwenden: Eine häufige Ursache für logische Fehler ist die Verwendung von „Enthält“ im Gegensatz zu "Ist." Eine Bedingung "Enthält" bedeutet, dass der Parameter, auf dem die Logik basiert (d. h. die aktuelle URL), den angegebenen Mittelwert zusätzlich zu weiteren Informationen enthält. Wenn ich zum Beispiel eine Logik hätte, die lautet "Aktuelle URL enthält 'QUALTRICS'", würde dies dazu führen, dass der Intercept bei jeder URL angezeigt wird, in der das Wort QUALTRICS vorkommt. Die andere Möglichkeit, die Sie haben, ist die Verwendung von Current URL is [URL]. Diese Bedingung hängt davon ab, dass die besuchte URL eine exakte Übereinstimmung ist. Alle Unterschiede oder zusätzlichen Zeichen verhindern, dass die Intercept-Logik weiterläuft.
- Änderungen an Intercepts: Bei der Bearbeitung von Intercepts werden die Änderungen erst nach der Veröffentlichung des Intercepts live geschaltet. Beim Veröffentlichen eines Interceptes wird eine Version des Interceptes, eine "Revision", gespeichert. Eine BEURTEILUNG der vorgenommenen Überarbeitungen ist sehr nützlich, um etwaige Änderungen zu erkennen, die das Auftauchen des Intercept plötzlich verhindert haben könnten.
- Debug-Fenster: Das Debug-Fenster ist ein unschätzbares Hilfsmittel, um zu überprüfen, warum ein Intercept auf einer bestimmten Seite nicht angezeigt wird.
Für Intercepts, deren Bereitstellungscode vor März 2019 implementiert wurde, muss zur Aktivierung des Debug-Fensters ein Query-String mit der Bezeichnung Q_DEBUG an eine beliebige URL angehängt werden. Dem muss ein „?“ oder ein „&“ vorangestellt werden, wie in den folgenden Beispielen: https://www.qualtrics.com?Q_DEBUG, https://www.qualtrics.com/blog?item=value&Q_DEBUG.
Für Intercepts, deren Bereitstellungscode nach März 2019 implementiert wurde, führen Sie den folgenden JavaScript-Codeausschnitt in der Konsole Ihrer Webseite aus:Das Debugging-Fenster zerlegt alle Bedingungen, die für Intercepts erforderlich sind, die auf der URL ausgeführt werden, um angezeigt zu werden. Wenn Sie feststellen, dass ein Intercept nicht angezeigt wird, suchen Sie es im Debugging-Fenster, und identifizieren Sie alle roten fehlgeschlagenen Warnungen.
QSI.API.unload();
QSI.isDebug = true;
QSI.API.load();
QSI.API.run();Tipp: Der „Website Insights“-Debugger funktioniert nicht, wenn der Code über einen Tag-Manager implementiert wurde. Wenn die URL bereits eine Query-String mit einem „?“ enthält, verlangt der Debugger stattdessen ein „&“. - Netzwerkanfragen: Die meisten Browser verfügen über ein Menü mit Entwicklertools, über das der Nutzer den Quellcode einer Website, Ressourcen, Cookies und Netzwerkanfragen einsehen kann. Website ERKENNTNISSE besitzt eine deutliche Präsenz in der Netzwerksektion dieser Werkzeuge. Um zu überprüfen, ob diese Skripte laufen, öffnen Sie die Werkzeuge für Entwickler und navigieren Sie zum Abschnitt Netzwerk. Laden Sie dann die Webseite neu, und das Menü sollte nun alle von der Website gestellten Netzwerkanfragen enthalten. Um den Code von Website ERKENNTNISSE zu identifizieren, suchen Sie nach Aufrufen, die mit ?Q_ZID oder ?Q_SID beginnen. Dies ist der Code selbst, der die Anzeigelogik überprüft. Wenn Sie nichts finden, was diesem Format entspricht, dann gibt es ein Problem mit der Implementierung Ihres Projektcodes. Auf unserer SUPPORTSEITE zur Implementierung finden Sie Hinweise, wo Sie den Code am besten platzieren können.
- Probleme mit der Content Security Policy: Wenn Sie ein Konsolenprotokoll erhalten, das gegen die Content Security Policy verstößt, gibt es höchstwahrscheinlich eine Einschränkung auf Ihrer Website, die die Bereitstellung unserer Intercepts blockiert. Wir empfehlen, sich zur Lösung an Ihr Web-Entwicklungsteam zu wenden. Um sicherzustellen, dass Ihre Intercepts funktionieren, empfehlen wir generell, die folgenden Elemente in Ihren Content-Security-Policy-Headern auf die Whitelist zu setzen:
- connect-src qualtrics
- frame-src qualtrics
- img-src https://siteintercept.qualtrics.com
- script-src qualtrics
- Umgang mit SPA-URLs: Wenn Ihre Website ein Single-Page-Application-Framework (SPA) verwendet, stellen Sie sicher, dass Ihr Code bei der Navigation zwischen den Ansichten die Funktion ` history.pushState() ` aufruft. Einige Frameworks können die URL neu darstellen oder aktualisieren, ohne einen neuen Verlaufseintrag zu erstellen, was dazu führen kann, dass Intercepts nicht ausgelöst werden. Wenn Sie useEffect oder ähnliche Lifecycle-Hooks verwenden, stellen Sie sicher, dass Ihre Intercept-Logik erst nach Abschluss der Navigation ausgeführt wird.
Ich habe meine Intercept-Funktion erstellt, möchte sie aber vor der Aktivierung testen. Wie kann ich das machen?
Ich habe meine Intercept-Funktion erstellt, möchte sie aber vor der Aktivierung testen. Wie kann ich das machen?
Großartig! Vielen Dank für die Rückmeldung!
Vielen Dank für die Rückmeldung!