fetch API

fetch

AJAX처럼 서버로 요청을 보내거나 자료를 받아오는 방법

✨프로미스를 반환 

 

fetch(위치,옵션)
- 위치: 자료가 있는 URL,파일이름
- 옵션: GET,POST 같은 요청방식 지정, 기본 값은 GET

 

if가 필요 없다 왜? then()함수를 연결하면서 이미 자료를 성공적으로 가져왔다는 전제이기 떄문!

 

실습 코드

const url="http://dummyjson.com/quotes"; 

fetch(url) //url을 읽어 온다
.then(reponse=>reponse.json()) //json파일을 객체로 변환
.then(data=>{ //객체 출력
    const result=document.querySelector("#result");
    const rdNum=Math.floor((Math.random()*data.quotes.length)+1);
    result.querySelector(".quote").innerHTML=data.quotes[rdNum].quote;
    result.querySelector(".author").innerHTML=`-${data.quotes[rdNum].author}-`;
    }    
).catch(error=>console.error(error)); //오류 발생시, 오류 보여주기

결과