JavaScript Fetch API

Fetch API 인터페이스는 웹 브라우저가 웹 서버에 HTTP 요청을 보낼 수 있도록 허용합니다。

XMLHttpRequest는 더 이상 필요하지 않습니다。

브라우저 지원

Fetch API를 완전히 지원하는 첫 번째 브라우저 버전은 표에 나와 있습니다:

크롬 IE 파이어폭스 사파리 오페라
크롬 42 에지 14 파이어폭스 40 사파리 10.1 오페라 29
2011년 6월 2016년 8월 2015년 8월 2017년 3월 2015년 4월

Fetch API 예제

다음 예제는 파일을 가져와 내용을 표시합니다:

예제

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

직접 테스트해보세요

Fetch가 async와 await를 기반으로 하기 때문에 위의 예제는 이렇게 쓰는 것이 더 이해하기 쉬울 수 있습니다:

예제

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

직접 테스트해보세요

다음은 더 나은 방법: x와 y 대신 이해하기 쉬운 이름을 사용하세요:

예제

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

직접 테스트해보세요