<
DQM Connect, 1.0.8 (2024.11)
DQM Connect, 1.0.8 (2024.11)
Dokumentation

Entwicklerhinweise: Headless-Support – DQM Connect

Für eine korrekte Interaktion mit DQM Connect muss in FirstSpirit-Projekten mit externer Vorschau-URL die Frontend-Applikation um eine zusätzliche Komponente erweitert werden.

Die Entwicklerhinweise beschreiben die einzelnen Schritte, die hierfür nötig sind.

Einrichtung

Einbinden der JavaScript-Bibliothek

Statt des NPM-Pakets können Sie das JavaScript des DQM Headless Connectors auch direkt in die Frontend-Applikation einbinden.

Verwenden Sie das HTML-Statement:

<script 
  src="http://$FS_INSTANCE/fs5webedit/dqm-connector/dqm-headless-connector.min.js">
</script>

Aufruf in der Frontend-Applikation

Zum Prüfen sämtlicher Inhalte mit DQM muss die Frontend-Applikation vollständig geladen sein.

Führen Sie den folgenden Code aus:

if (environment.enableDqmConnector) {
    const dqmConnector = new DqmHeadlessConnector();
    dqmConnector.refreshDqmReport();
}

Wenn zu einem späteren Zeitpunkt weitere Inhalte nachgeladen werden – etwa durch kontinuierliches Scrollen – muss der Aufruf erneut erfolgen.

  • Führen Sie diesen Code nicht in einer Produktivumgebung aus.
  • Bei mehrseitigen Frontend-Applikationen (z.B. via Routing), darf dieser Aufruf erst ausgeführt werden, wenn eine Seite vollständig geladen ist.

Öffnen des Reports im ContentCreator

Im DQM-Report in der rechten Seitenleiste wird die Liste mit Einträgen angezeigt.

Fehlerbehebung

Problem Lösung

Im ContentCreator wird kein DQM-Report angezeigt.

Das DQM Connector-Modul muss auf dem FirstSpirit-Server installiert und konfiguriert sein.

Im ContentCreator wird die Frontend-Applikation nicht angezeigt.

Die Frontend-Applikation muss gestartet sein. Die URL im ContentCreator muss als externe Vorschau-URL konfiguriert sein.

Im DQM-Report erscheinen keine Einträge.

  • Installieren Sie das NPM-Paket "dqm-headless-connector" in der Frontend-Applikation.

  • Rufen Sie das Paket auf.
    In der Browserkonsole wird als Bestätigung angezeigt:

    Transmitting HTML of external preview website to server...

    HTML of external preview website transmitted successfully.

Wenn nun keine Einträge angezeigt werden, ist es möglich, dass es keine Probleme in der Frontend-Applikation gibt.

Seiteninhalte