본문 바로가기

XMLHttpRequest Object

Ajax 페이지를 만들 때, 가장 먼저 해야할 일이 있다.
서버와 연결할 수 있는 XMLHttpRequest 객체 생성.
XMLHttpRequest가 도대체 어떤 놈인지 알아보았다.


HTTP Request 는 무엇인가?

HTTP 요청을 가지고 웹 페이지가 요청을 만들 수 있다.
그리고 페이지 리로드없이 웹서버로부터 응답을 얻는다.
사용자는 같은 페이지에 머무를 것이고, 스크립트가 페이지를 요청하거나 백그라운드에서 서버에 데이터를 보내는 것에는 주의하지 않을 것이다.

XMLHttpRequest 객체를 사용함으로서, 웹 개발자는 페이지가 로드된 후에 서버의 데이터로 페이지를 변경할 수 있다.
Google Suggest는 매우 동적인 웹 인터페이스를 만들기 위해 XMLHttpRequest 객체를 사용하고 있다. 사용자가 구글의 검색박스에 타이핑을 시작할 때 자바스크립트는 서버에 문자를 보내고, 서버는 추천 목록을 반환한다.


XMLHttpRequest 객체는 W3C 표준인가?

XMLHttpRequest 객체는 자바스크립트 객체이고, W3C에서 추천하지 않는다.
그러나, W3C DOM 레벨 3 "Load and Save" 명세는 몇몇 유사한 기능을 포함하지만, 아직 어떤 브라우저에서도 작동되지는 않는다.
만약 사용자가 브라우저에서 HTTP 요청을 보내고 싶다면, XMLHttpRequest 객체를 사용하여야만 할 것이다.


XMLHttpRequest 객체 생성

For Mozilla, Firefox, Safari, Opera, Netscape:
var xmlhttp = new XMLHttpRequest();

For Internet Explorer:
var xmlhttp = new ActiveXObject( "Microsoft.XMLHTTP" );


XMLHttpRequest Object Reference

Methods
  • abort()
    현재 요청을 취소한다.
  • getAllResponseHeaders()
    http 헤더의 완전한 셑을 문자열로 반환한다.
  • getResponseHeader( "headername" )
    지정된 http 헤더의 값을 반환한다.
  • open( "method", "URL", async, "uname", "pswd" )
    method와 URL, 요청의 다른 선택적인 속성들을 지정한다.
    method 파라미터는 "GET", "POST", "PUT"의 값을 가질 수 있다.
    보통 처음 데이터 검색 요청에는 GET 연산자를 사용하고, 서버에 자료를 보낼 때와 특히 출력데이터의 길이가 512byte 보다 클때는 POST 연산자를 사용한다.
    URL 파라미터는 상대주소나 절대주소도 가능하다.
    async 파라미터는 요청이 동기식인지, 비동기식인지를 지정한다.
    true는 응답을 기다리지 않고, send() 메소드 뒤에 스크립트 처리를 계속하는 것을 의미하고 false는 스크립트 처리를 계속하기 전에 응답을 기다리는 것을 의미한다.
  • send( content )
    요청을 보낸다.
  • setRequestHeader( "label", "value" )
    보내진 http 헤더에 label과 value 한 쌍을 더한다.

Properties
  • onreadystatechange
    모든 상태가 바뀔 때 발생하는 이벤트에 대한 이벤트 핸들러
  • readyState
    객체의 상태를 반환한다.
    0 = uninitialized
    1 = loading
    2 = loaded
    3 = interactive
    4 = complete
  • responseText
    문자열로 응답을 반환한다.
  • responseXML
    XML로 응답을 반환한다. 이 속성은 W3C DOM 노드 트리 메소드와 속성을 사용하여 검사되고 분석될 수 있는 XML 문서 객체를 반환한다.
  • status
    숫자로 상태를 반환한다. (예, "Not Found" - 404, "OK" - 200)
  • statusText
    문자열로 상태를 반환한다. (예, "Not Found"나 "OK"등)