Error 500, findet den Pfad nicht.

[mirkobrnck]

Die Einbindung des Footers klappt lokal sehr gut, aber wenn ich das Skript auf anderen Seiten zum Beispiel lffl-consulting.com (die bisher auch noch lokal ist) einbinde kann er das Skript von der Domain (embed.allesdigital.io), die wir vergeben haben nicht laden. Liegt es daran, dass die lffl-seite lokal ist? Eigentlich ja nicht, da diese ja auch auf externe websites zugreifen kann. [vite-node] [ENOENT] https:/embed.allesdigital.io/footer.js?vue&type=script&src=true&async=true&charset=utf-8&lang.js [ENOENT] bedeutet anscheinend, dass der Pfad nicht gefunden wird. Weiß aber nicht, was ich ändern kann um das zu ändern. @steffkes @mohamberger

[steffkes]

[vite-node] [ENOENT] https:/embed.allesdigital.io/...

Also da fehlt auf den allerersten Blick mal direkt ein / zwischen Protokoll und Pfad!

[mirkobrnck]

ich weiss nicht warum das in der fehlermeldung so angezeigt wird aber im code sind 2

[steffkes]

weil das definitiv nicht die korrekte vorgehensweise ist um via nuxt ein externes script einzubinden. google keywords "nuxtjs3 embed external script", abhängig davon wie/wo das einbinden am sinnvollsten ist: entweder über nuxt.config.js oder im jeweiligen template mittels useHead

[mirkobrnck]

Danke dir stefan :) habe es jetzt mal im template des footers vom adx-website-kit getestet und mittels useHead eingebunden <script setup> useHead({ script: [ { async: true, src: "https://embed.allesdigital.io/footer.js", type: "text/javascript", }, ], }); </script> und das klappt meistens. Leider nur. Wenn es klappt kommen in der Console folgende Warnungen: wenn es nicht klappt (nach dem ich die Seite neu lade, aber auch nicht immer) kommt folgender Error:

Bin selbst noch auf der Fehlersuche aber erkenne leider kein Muster oder die Abhängigkeit wann es klappt und wann nicht.

[mirkobrnck]

Ich habe getestet welche Bedingung ausgeführt wird. Scheint so als habe ich einen Fehler in der If-Abfrage:

    var isFooter = document.getElementById("adx-footer");
    if (isFooter != null) {
      const adxFooter = createFooterElement();
      isFooter.replaceWith(adxFooter);
      console.log("erste Bedingung");
    } else {
      console.log("zweite Bedingung");
      document.body.appendChild(createFooterElement());
    }

manchmal wird der else Befehl ausgeführt. Das heißt das die Variable isFooter ist manchmal noch null wenn die If-Abfrage ausgeführt wird.

[mirkobrnck]

Das liegt wharscheinlich daran, dass das Script ja in den Header geschrieben wird und somit ausgeführt wird bevor die DOM-Elemente der seite geladen sind (https://stackoverflow.com/questions/30014090/uncaught-typeerror-cannot-read-property-appendchild-of-null). Habe nun einen async und await dem footer.js hinzugefügt, damit das script wartet bis die document.getElemetById("adx-footer") funktion ausgeführt wurde. Nun hat es immer geklappt.

 (async () => {
    const isFooter = await new Promise((resolve) => {
      document.addEventListener("DOMContentLoaded", () => {
        const footerElement = document.getElementById("adx-footer");
        resolve(footerElement);
      });
    });

    if (isFooter !== null) {
      const adxFooter = createFooterElement();
      isFooter.replaceWith(adxFooter);
      console.log("erste Bedingung");
      console.log(isFooter);
    } else {
      console.log("zweite Bedingung");
      console.log(isFooter);
      document.body.appendChild(createFooterElement());
    }