Ajax 서버 응답 처리

서버 응답 처리

서버로 요청을 보내기 전에, 서버의 응답을 처리하기 위해 지정한 자바스크립트 함수

httpRequest.onreadystatechange = nameOfTheFunction;

일단, 상태값을 검사한다. 상태값이 XMLHttpRequest.DONE -> 서버로부터 모든 응답을 받았으며 이를 처리할 준비가 됨

if (httpRequest.readyState === XMLHttpRequest.DONE) {
    // 이상 없음, 응답 받았음
} else {
    // 아직 준비되지 않음
}

readyState 가 가질 수 있는 모든 값의 목록

• 0 (uninitialized) - (request가 초기화되지 않음)
• 1 (loading) - (서버와의 연결이 성사됨)
• 2 (loaded) - (서버가 request를 받음)
• 3 (interactive) - (request(요청)을 처리하는 중)
• 4 (complete) - (request에 대한 처리가 끝났으며 응답할 준비가 완료됨)

 

HTTP 응답 상태 코드를 검사

AJAX 요청이 정상적으로 처리되었는지 아닌지만을 검사하는 예제

if (httpRequest.status === 200) {
    // 이상 없음!
} else {
    // 요구를 처리하는 과정에서 문제가 발생되었음
    // 예를 들어 응답 상태 코드는 404 (Not Found) 이거나
    // 혹은 500 (Internal Server Error) 이 될 수 있음
}

응답 데이터에 접근하기 위한 옵션

• http_request.responseText – 서버의 응답을 텍스트 문자열로 반환할 것이다.
• http_request.responseXML – 서버의 응답을 XMLDocument 객체로 반환하며 자바스크립트의 DOM 함수들을 통해 이 객체를 다룰 수 있다.

위의 단계는 비동기식 요구(asynchronous request)를 사용할때이지만, 동기식(Synchronous) 방법을 사용한다면 함수를 명시할 필요 없이 send() 호출에 의해 반환되는 data를 바로 사용 할 수 있다. 그러나 이는 스크립트가 send()를 호출할 때 멈춰지며 서버의 응답이 완료 될 때까지 기다려야하는 단점이 있다.