JavaScript Fetch API

De Fetch API-interface staat webbrowsers toe om HTTP-verzoeken naar web servers te sturen.

Geen behoefte aan XMLHttpRequest meer.

Browserondersteuning

Tabelweergave van de eerste browserversie die Fetch API volledig ondersteunt:

Chrome IE Firefox Safari Opera
Chrome 42 Edge 14 Firefox 40 Safari 10.1 Opera 29
Juni 2011 Augustus 2016 Augustus 2015 Maart 2017 April 2015

Fetch API voorbeeld

Hier is een voorbeeld dat een bestand ophaalt en de inhoud weergeeft:

Voorbeeld

fetch(file)
.then(x => x.text())
.then(y => myDisplay(y));

Probeer het zelf

Omdat Fetch gebaseerd is op async en await, kan de bovenstaande voorbeeld zo geschreven mogelijk zijn om te begrijpen:

Voorbeeld

async function getText(file) {
  let x = await fetch(file);
  let y = await x.text();
  myDisplay(y);
}

Probeer het zelf

Zelfs beter: gebruik begrijpelijke namen in plaats van x en y:

Voorbeeld

async function getText(file) {
  let myObject = await fetch(file);
  let myText = await myObject.text();
  myDisplay(myText);
}

Probeer het zelf