JavaScript에서 HTTP 상태 코드를 쉽게 얻는 방법

JavaScript에서 HTTP 상태 코드를 얻는 방법

소개:
프론트 엔드 개발에서는 종종 백엔드 인터페이스와의 상호 작용을 처리해야 하며 HTTP 상태 코드는 매우 중요한 부분입니다. HTTP 상태 코드를 이해하고 얻는 것은 인터페이스에서 반환된 데이터를 더 잘 처리하는 데 도움이 됩니다. 이 기사에서는 JavaScript를 사용하여 HTTP 상태 코드를 얻는 방법을 소개하고 구체적인 코드 예제를 제공합니다.

1. HTTP 상태 코드란 무엇입니까? HTTP 상태 코드는 브라우저가 서버에 요청을 시작할 때 서버가 반환하는 응답 헤더에 포함된 숫자 코드를 나타냅니다. 이 숫자 코드는 서버의 요청 처리 결과를 나타냅니다. 일반적인 상태 코드에는 200, 404, 500 등이 포함됩니다.

1XX: 요청이 수신되었으며 계속 처리되고 있음을 나타냅니다. 일반적인 것은 100(계속)입니다.
• 2XX: 요청이 서버에서 성공적으로 수신되고 이해되었으며 수락되었음을 나타냅니다. 일반적인 것은 200(성공)이다.
• 3XX: 요청을 완료하려면 추가 조치가 필요함을 나타냅니다. 일반적인 것은 301(영구 리디렉션)과 302(임시 리디렉션)입니다.
• 4XX: 클라이언트 오류를 ​​나타냅니다. 요청에 구문 오류가 포함되어 있거나 요청을 완료할 수 없습니다. 일반적인 것들은 404(찾을 수 없음)와 403(금지됨)입니다.
• 5XX: 서버 오류를 나타냅니다. 서버가 요청을 처리하는 동안 오류가 발생했습니다. 일반적인 것은 500(서버 내부 오류), 503(서비스 불가)입니다.

2. XMLHttpRequest 사용

XMLHttpRequest는 서버와 상호 작용하는 데 사용되는 내장 브라우저 개체로, 이를 통해 HTTP 요청을 보내고 서버의 응답을 받을 수 있습니다. 서버 응답을 받을 때 XMLHttpRequest 객체의 상태 속성을 통해 HTTP 상태 코드를 얻을 수 있습니다.

특정 코드 예:

var xhr = new XMLHttpRequest();
xhr.open('GET', 'http://example.com/api');
xhr.onreadystatechange = function() {
    if (xhr.readyState === XMLHttpRequest.DONE) {
        var status = xhr.status;
        console.log(status);
    }
};
xhr.send();

위 코드를 사용하여 "http://example.com/api" 인터페이스에 GET 요청을 보냈고 서버 응답을 받은 후 HTTP 상태 코드를 얻었습니다.

3. fetch 사용

fetch는 JavaScript의 단순화된 네트워크 요청 API로 Promise를 사용하여 네트워크 요청의 비동기 작업을 처리합니다. fetch에 의해 반환된 결과는 Promise 객체이며, res.status 속성을 통해 HTTP 상태 코드를 얻을 수 있습니다.

특정 코드 예시:

fetch('http://example.com/api')
    .then(function(res) {
        var status = res.status;
        console.log(status);
    });

위 코드를 통해 "http://example.com/api" 인터페이스에 GET 요청도 보냈고, 서버 응답을 받은 후 HTTP 상태 코드를 얻었습니다.

위는 JavaScript를 사용하여 HTTP 상태 코드를 얻는 두 가지 일반적인 방법이며 구체적인 코드 예제가 제공됩니다. 프런트 엔드 개발에서 HTTP 상태 코드를 이해하고 얻으면 인터페이스에서 반환된 데이터를 더 잘 처리하여 사용자 경험과 애플리케이션 안정성을 향상시키는 데 도움이 될 수 있습니다. 이 글이 모두에게 도움이 되기를 바랍니다!

위 내용은 JavaScript에서 HTTP 상태 코드를 쉽게 얻는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!