[정보] JavaScript에서 HTTP 요청을 만드는 방법

JavaScript에서 HTTP 요청을 만드는 방법으로는 내장된 fetch() 함수나 XMLHttpRequest (XHR) 객체를 사용할 수 있습니다. 다음은 fetch()을 사용하는 예시입니다:

 

 

fetch('https://example.com/data')
  .then(response => response.json())
  .then(data => console.log(data))
  .catch(error => console.error(error));

이 예시에서는 https://example.com/data로 GET 요청을 보내고 있습니다. fetch() 함수는 요청에 대한 서버의 응답을 나타내는 Response 객체를 반환하는 Promise를 반환합니다.

그런 다음, Response 객체에서 json() 메소드를 호출하여 응답에서 JSON 데이터를 추출할 수 있습니다. 이 메소드는 Promise를 반환하여 파싱된 JSON 데이터를 나타냅니다.

두 번째 then() 메소드를 사용하여 이전 Promise에서 반환된 JSON 데이터를 처리할 수 있습니다. 이 예제에서는 데이터를 콘솔에 로그로 출력하지만, 여기에서 필요한 작업을 수행할 수 있습니다.

마지막으로, catch() 메소드를 사용하여 요청 또는 응답 중에 발생할 수 있는 오류를 처리합니다.

다음은 XMLHttpRequest (XHR) 객체를 사용하는 예시입니다:

 

const xhr = new XMLHttpRequest();
xhr.open('GET', 'https://example.com/data');
xhr.responseType = 'json';
xhr.onload = function() {
  console.log(xhr.response);
};
xhr.send();

이 예시에서는 새로운 XHR 객체를 만들고 https://example.com/data로 GET 요청을 엽니다. responseType 속성을 json으로 설정하여 XHR 객체가 응답을 자동으로 JSON으로 파싱하도록합니다.

onload 이벤트 핸들러를 설정하여 성공적인 응답을 처리합니다. 이 예시에서는 응답을 콘솔에 로그로 출력합니다.

마지막으로, send() 메소드를 호출하여 요청을 보냅니다.