JavaScript Fetch API

Čeprav je objekt XMLHttpRequest dolgo časa kraljeval v AJAX komunikaciji, ima sodobni JavaScript zanj veliko boljšo, krajšo in bolj elegantno zamenjavo: Fetch API. Fetch uporablja tako imenovane Promises (obljube), kar nam omogoča pisanje veliko bolj čiste kode brez zapletenega preverjanja stanj (readyState).

Kako deluje osnovni Fetch?

Metoda fetch() vzame samo en obvezen parameter: pot do podatkov (URL). Ker deluje z obljubami, odgovore povezujemo s pomočjo metode .then():

1. fetch() pošlje zahtevo na strežnik.
2. Prvi .then() prejme surov odgovor in ga pretvori v besedilo ali JSON objekt.
3. Drugi .then() prejme končne podatke, ki jih lahko takoj izpišemo na stran.

fetch("abeceda.php?q=A")
    .then(odgovor => odgovor.text()) // Pretvori surov odgovor v tekst
    .then(podatki => {
        document.getElementById("izpis").innerHTML = podatki;
    });

Glavna prednost: Koda je izjemno berljiva, nima zapletenih poslušalcev dogodkov in avtomatsko podpira sodobne formate podatkov, kot je JSON.