it-swarm.com.de

SEF URL Broken Image Links beim Abrufen von API-Ergebnissen

Verwenden von Joomla 3.9.8

Ich verwende die fetch () api , um einige Daten von einer Remote-API abzurufen. Wenn ich die API-Ergebnisse habe, zeige ich sie in HTML-Elementen an.

Die API gibt verschiedene Werte zurück, einer davon ist url. Ich muss dieses url in ein Bild src einfügen. Dies ist normalerweise ziemlich einfach, aber ich habe festgestellt, dass beim Versuch in Joomla das Bild src neu geschrieben und mit meinem Site-Namen versehen wird. Dies führt zu fehlerhaften Bildern .

Um den Code einzufügen, verwende ich Sourcerer und ein benutzerdefiniertes HTML-Modul.

Ich habe ein abgespecktes Beispiel erstellt, um das Problem zu demonstrieren. In diesem Beispiel verwende ich die zufällige Benutzer-API , aber die Logik ist bei jeder API dieselbe.

Der Code, den ich mit Sourcerer in das benutzerdefinierte HTML-Modul einfüge, lautet:

<script>
fetch("https://randomuser.me/api/")
    .then(response => response.json())
    .then(data => {
      var url = data.results[0].picture.large;
      console.log(url);
      // displays https://randomuser.me/api/portraits/men/47.jpg
      console.log('<img src=" '+url+' ">');
      // displays <img src="/example.com/ https://randomuser.me/api/portraits/men/47.jpg " >
})
</script>

Ich protokolliere die Variable url in der Konsole, und das Problem ist klar. Dem Bild src wird mein Domainname vorangestellt.

Hier ist eine Geige enthält genau den gleichen Code, unterschiedliche Ergebnisse.

Ich bin mir fast sicher, dass es ein Problem mit Joomla SEF-URLs ist, denn wenn ich das Plugin> System - SEF deaktiviere, funktioniert alles wie erwartet .

Ich habe einen Artikel, der erklärt das Problem und einige mögliche Schritte zur Fehlerbehebung wie das Neuanordnen der Plugin-Reihenfolge gelesen, aber nichts scheint zu funktionieren.

Hoffentlich kann jemand helfen, da ich schon eine ganze Weile daran festhalte.

2
jonboy

Also ... ich habe es mir viel zu schwer gemacht.

Die Antwort ist, dass ich direkt nach dem Öffnen ein Leerzeichen in meinem Code hatte img src=" Dies führte dazu, dass das Joomla SEF-Plugin meiner Domain-URL im Leerzeichen voranstellte.

Originalcode;

console.log('<img src=" '+url+' ">');

Arbeitscode;

console.log('<img src="'+url+'">');

Hoffe, das spart jemand anderem ein paar Stunden Arbeit.

1
jonboy