[JavaScript] Ajax - XMLHttpRequest

XMLHttpRequest 객체 얻기

function getXmlHttpRequest() {
   var xmlhttp;
   
   if (window.XMLHttpRequest) {
      xmlhttp = new XMLHttpRequest();
      xmlhttp.overrideMimeType('text/xml');
   } else {
      try {
         xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
      } catch(e) {
         try {
            xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
         } catch(e) {
            xmlhttp = false;
         }
      }
   }
   return xmlhttp;
}

XMLHttpRequest 메소드

open
open(method, url[, async, username, password])와 같이 사용한다. open 메소드는 지정도니 메소드(GET이나 POST)를 사용해서 주어진 URL로의 연결을 생성한다. 옵션 인자는 async이고, async는 비동기(true) 또는 동기(false)로 요청을 수행한다. 기본값은 true이므로 비동기로 동작한다.

setRequestHeader
setRequestHeader(label, value)와 같이 사용한다. 요청 헤더에 "레이블/값" 쌍을 추가하는 메소드이다.

send
send(content)와 같이 사용한다. 관련 데이터를 이 메소드를 사용해서 넘겨준다.

getAllResponseHeaders
getAllResponseHeaders()와 같이 사용한다. 모든 HTTP 응답 헤더를 문자열로 반환한다. 여기에 포함된 데이터는 Keep-Alive 타임아웃 값, content-type, 서버에 대한 정보, date와 같은 정보들이다.

getResponseHeader
getResponseHeader(label)와 같이 사용한다. 특정 HTTP 응답 헤더를 반환한다.

abort
abort()와 같이 사용한다. 현재 요청을 취소한다.

function executeAjax() {
   var query = 'page=1'
   var url = 'ajax.jsp';
   xmlhttp.open('POST', url, true);
   xmlhttp.onreadystatechange = ajaxHandler;
   xmlhttp.stRequestHeader('Content-type', 'application/x-www-form-urlencoded');
   xmlhttp.send(query);
}

XMLHttpRequest 프로퍼티

프로퍼티	용도
Onreadystatechange	요청의 준비 상태가 변경될 때 호출되는 함수에 대한  핸들을 갖고 있는 프로퍼티
readyState	0 - 초기화되지 않은 요청  1 - 열려있는 요청  2 - 이미 전송된 요청  3 - 응답을 받음  4 - 응답을 로드하기가 끝났을 때
responseText	텍스트로 응답
responseXML	XML로 응답
status	서버 상태를 반환 (404, 500, 200)
statusText	상태 정보 텍스트