[Ajax] XMLHttpRequest Object

http://blog.naver.com/radmip/120029310344

Ajax 구현의 시작은 XMLHttpRequest객체의 생성부터 생각하면 된다

XMLHttpRequest객체는 최초 IE5에서 ActiveX Component 형식으로 먼저 제공되었으며 현재 대부분의 브라우저들이 지원하고 있다. ( XMLHttpRequest는 W3C의 표준이 아니므로 IE는 ActiveX형식으로, 다른 브라우저(FireFox, Safari, Opera등)은 Native Javascript로 구현되었다. )

Ajax 요소 기술로는 앞서 얘기한 XMLHttpRequest를 필두로 XHTML, CSS, XML, XLST, Javascript, DOM 등이 사용되며, Javascript가 ECMA표준이며 다른 기술은 W3C표준이므로, 모든 브라우저 개발 업체/단체의 합의하에 통용되는 표준으로 자리매김되어 있다.


또 각설하고..


XMLHttpRequest를 생성시킨다. ( 역시나 constructor는 그게 그거다 )

var xmlHttp;
function createXMLHttpRequest() {
    // case : browser (브라우저 별 처리)
    if (window.ActiveXObject) {
        xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
    } else if (window.XMLHttpRequest) {
        xmlHttp = new XMLHttpRequest();
    }
}

왜 생성했느냐?

Ajax의 시작은 XMLHttpRequest라면서.. 정답이다.


Hello Java!!를 처음 했을 때처럼 Class를 생성하고 나면?
다양한 사용자 요구 및 데이터 처리를 위해서 Member와 Method를 만들어야 한다.


XMLHttpRequest에는 어떤 Attribute와 Method가 있는지 알아보자.



Method


void open(string method, string url, boolean asynch, string username, string password)
: 요청을 초기화한다.
* method - 'POST', 'GET', 'PUT' 중 하나를 사용 (필수)
* url - 요청 서버의 url (필수)
* asynch - true (default), false 설정(synch)시 서버 응답까지 대기


void send(content)
: 요청을 서버로 보낸다. 비동기시 요청한다로 끝이지만 동기시면 응답을 받을때까지 대기한다.
* content - DOM 객체(XML 객체)이거나 input stream, string 값등으로 설정

        open() Parameter의 method 값이 'POST'로 설정되어 있으면

        HttpRequest Body에 포함되어 서버로 전달된다.

        GET 방식으로 요청하려면 null 을 설정하면 된다. (선택사항)

void setRequestHeader(string header, string value)
: open() 다음에 위치해서 HttpRequest 헤더에 value를 설정하는 메소드


void abort() : 요청을 중지한다.


string getAllResponseHeaders()
: 요청에 대응되는 응답의 헤더정보를 리턴한다.

 즉, Content-Length, Date, URI 등을 포함하는 헤더정보를 string 형식으로 반환한다.


string getResponseHeader(string header)
: 응답의 헤더정보중에서 header 에 대응되는 값을 string 형식으로 반환한다.


Attribute

onreadystatechange
: 자바스크립트 콜백함수(funtion pointer)를 저장한다.
 콜백함수는 readyState 값이 변할때 마다 호출된다.
 요청이 서버로 보내지면 readyState 는 5가지 숫자값으로 계속 변화가 일어나게 된다.


readyState
: 요청의 상태를 의미한다.

 (0 = uninitialized, 1 = loading, 2 = loaded, 3 = interactive, 4 = complete)


responseText
: 서버의 응답을 string 형식으로 나타낸다.
단순 text를 innerHTML 속성으로 표현하기에는 알맞지만 논리적으로 파싱하거나 동적으로 페이지 컨텐츠를 생성하기는 힘들다.


responseXML
: 서버의 응답을 XML로 나타낸다. 이 속성은 DOM 객체로 파싱할 수 있다.


status
: 서버로부터의 HTTP 상태코드.(200[OK], 404[NOT Found], 202[결과 값이 없을 때] 등)

statusText
: HTTP 상태코드에 대한 텍스트 값이다.(예 OK, NOT Found 등등)

Attribute와 Method는 명칭이다.(존재자이다. 인식하던가 외우던가~)