1. jQuery AJAX ☞ XMLHttpRequest 객체 참조
ㅇ 범용 메서드 : $.ajax( url [, 옵션] ) => 모든 종류의 AJAX 처리 가능
- url : 목적지 URL (디폴트 : 현재 페이지)
- 주요 파라미터 옵션
. type : POST/GET (HTTP 메소드 종류) (디폴트 : GET 메소드)
. data : 송신할 데이터
. datatype : 응답받을 데이터 형식 (xml, html, script, json, jsonp, text)
.. 미지정이면, 응답 메세지의 MIME type으로부터 추론함
. contentType : AJAX 요청시 Content-Type HTTP 헤더
.. 기본값 : application/x-www-form-urlencoded
. async : 비동기적으로 통신할 지 여부
.. 기본값 : true
. timeout : 타임아웃 밀리 초 (제한시간 초과하면 요청 중단)
- 콜백함수 옵션 (통신 중간 상태 구분)
. beforeSend : 요청을 서버로 전송하기 전에 수행
. success : 요청 성공시 콜백함수 수행
. error : 요청 실패시 콜백함수 수행
. complete : 요청 결과의 성공,실패 여부에 상관없이 맨마지막 수행
ㅇ 단축형 메서드
- $.get() : GET 메소드 요청하고, 서버로부터 데이터 로딩
- $.post() : POST 메소드 요청하고, 서버로부터 데이터 로딩
- $.getJSON() : GET 메소드 요청하고, 서버로부터 JSON 형식의 데이터를 로딩
- $.getScript() : GET 메소드 요청하고, 서버로부터 자바스크립트 파일을 로딩 후 실행
- $.load() : 서버로부터 데이터를 선택 요소의 컨텐츠로 대체 로딩
2. jQuery XHR 객체 (jqXHR) 활용 (jQuery 1.5 버전 이후)
ㅇ 1.번항의 경우에서는,
- 하나의 비동기 콜백함수에 모든 경우를 다 표현하는 방법 임
ㅇ 이와는 다른 방법으로,
- ajax 리턴 값을 중간적인 변수 객체를 통해, 결과에 따라 다르게 처리하는 방법으로써,
- 리턴되는 객체의 결과 종류(done, fail, always 등)에 따른 다른 처리 가능
. 완료되었을 때 : done 메소드 호출
. 실패했을 때 : fail 메소드 호출
. 완료되었건 실패했건 행동이 끝났으면 : always 메소드 호출
- 한편,
. 위 각 리턴 결과 종류(done, fail, always) 마다,
. 그에 따른 1.번항의 콜백 함수 옵션(success, error, complete)이 대응 됨
var jqxhr = $.ajax( {
url : "...",
type : "...",
data : "..."
});
jqxhr.done( function(data, status, xhr) {
...
});
jqxhr.fail( function(data, status, xhr) {
...
});
jqxhr.always( function(data, status, xhr) {
...
});