Seiten-Content erhalten

[Simuletsplay]

Hallo zusammen,

ich bin noch ein JS Anfänger und versuche derzeit folgendes:

Ich möchte gerne einen Seiten-Content (Beispiel: https://api.laut.fm/station/hyrisefm/listeners) als Variable in JS haben.
Wie kann ich das machen?

Im Internet bin ich auf folgenden Code gestoßen:

Code:

fetch("https://URL/file").then((r)=>{r.text().then((d)=>{let CONTENT = d})})

Damit der auch was ausgibt hab ich folgendes versucht:

Code:

var content = "";
fetch("https://api.laut.fm/station/hyrisefm/listeners")
.then((r)=>{r.text()
.then((d)=>{content = d})})

console.log(content);

Aber die Ausgabe bleibt leer.

Was kann ich da tun?

Woran liegt das?

[admin]

Moin, wie gehts?
Lange nichts mehr gehört von dir.
Versuche es mal so

Code:

function h() {
    fetch('https://api.laut.fm/station/hyrisefm/listeners').then((response) => {
      return response.json().then((json) => {
        console.log("JSON", json)
        this.json = json
      })
    })
  }
h()

[Simuletsplay]

Hallo admin,

alles bestens bei mir
Danke der Nachfrage!

Leider muss ich zugeben, dass ich den Code dort oben nicht ganz verstehe...
Was dort gemacht wird ist mir nur ganz grob klar.

Wie kann ich das machen, dass der Return der function mein text ist?

Ich rufe also die Funktion folgendermaßen auf:

var text = h();

Und dabei soll bei text der Inhalt angegeben werden, der auf der Website steht. In diesem Falle zwar eine Zahl, aber in anderen Fällen habe ich einen String.

Ja, dort in der Funktion steht ein Return, jedoch erkenne ich nicht ganz das Statement dahinter....

Liebe Grüße
Ben

[admin]

Ehrlich gesagt, hatte ich keine Ahnung.
Ich habe bis jetzt immer die Daten innerhalb des fetch Blockes verarbeitet , und nie außerhalb , bzw. außerhalb einer, Funktion aufgerufen, wo die fetch drin ist.

Habe eben auch 100 verschiedene Sachen versucht, wie es klappen könnte.
Wusste gar nicht das die fetch API so scheißen kompliziert ist.
Versuche es mal so

Code:

const getData = async () => {
  const res = await fetch("https://api.laut.fm/station/hyrisefm/listeners");
  if (!res.ok) {
    throw new Error(`${res.status}: ${await res.text()}`);
  }
  return res.json();
};
const dataPromise = getData();
dataPromise.then((result) => {
  alert(result);
});

[Simuletsplay]

ahhhhhh, da kam der Denkanstoß!!!

INNERHALB DES FETCH-BLOCKS!

Hab ich jetzt so gemacht...

Vielen Dank!