HTTP 통신을 해보자

자바스크립트에서 HTTP 통신은 먼저 HTTP 요청을 보내는 것부터 시작한다.

코드로는 XMLHttpRequest 객체를 생성하는 것부터 시작하면 된다.

const xhr = new XMLHttpRequest();	// 모든 브라우저가 이 객체를 지원
xhr.open("GET", "https://jsonplaceholder.typicode.com/posts");	// 첫번째 인자: 사용할 HTTP 메서드 / 두번째 인자: 요청을 보낼 URL

xhr.onload = function () {
  // console.log(xhr.response);	// xhr 요청의 응답 결과를 콘솔로 확인
  // posts.push({}) // xhr로 받아온 배열은 JS에서 바로 사용 가능한 배열이 아닌 'JSON 배열'이라서 변환 필요.
  const posts = JSON.parse(xhr.response);
  console.log(posts);
};

 

이 코드는 'JSON Placeholder' 라는 사이트가 제공하는 posts JSON 데이터를 임의로 가져온다.