AJAX(Asynchronous JavaScript And XML)

AJAX(Asynchronous JavaScript And XML)

• 페이지 재로딩 없이 페이지를 갱신할수 있다.
• 페이지가 로드된후 서버로부터 요청과 응답을 받을수 있다.
• 백그라운드 상에서 데이터를 서버에 보낼 수 있다

 

1. AJAX의 핵심은 XMLHttpRequst Object 이다.

현대 모든 브라우저에서는 XMLHttpRequst를 지원한다. XMLHttpRequst를 사용하면, 페이지 내에서 서버를 이용하여 데이터를 바꿀수 있다. 이 의미는 페이지 재로딩 없이 웹페이지 를 갱신할수 있다.

 

2. XMLHttpRequest 객체 생성하기

모든 현대 브라우저는 XHLHttpRequest 를 생성할수 있다.

보안을 위해 최신브라우저들은 도메인에서 액세스를 허용하지 않는다. 웹페이지가 로드 되려고 하려면 XML파일은 모두 동일한 서버에 있어야 된다.

 

 

3. AJAX서버로의 전송.

XMLHttpRequest 객체를 사용하여 서버와 데이터를 주고 받는다.

open() , send() 메소드를 사용하여 XMLHttpReuqest 객체에 서버로 전송한다.

GET or POST

GET은 POST방식보다 더 빠르고 심플하다. 하지만 이럴 경우게 POST를 사용한다.

l 파일을 데이터베이스나 서버에 캐시파일로 사용하지 않을 때.

l 많은 양의 데이터를 보낼 때.

l 파라미터 값을 보낼 때 숨겨야 할 때.

 

4. AJAX Response – 서버 응답

readyState 프로퍼티는 XMLHttpRequest 에 상태를 보유 한다.

Onreadystatechange 프로퍼티는 readyStat 프로퍼티가 변할 때 함수의 값을 정의한다.

Status 프로파티와 statusText 프로퍼티는 XMLHttpRequest 객체에 상태를 보유한다.

 

 

5. 콜백함수의 사용

콜백함수는 다른 함수로 매개변수를 통해서 전달되는 함수이다.

만약 웹페이지 에서 더욱 많은 AJAX 기능을 사용할 때, XMLHttpRequest 객체 를 통해 함수를 생성하고, AJAX 를 통해 함수를 콜백하여 사용한다.

 

서버 응답 프로퍼티

 

ResponseText

자바스크립트에서 스트링 값이나, 사용자가 사용할수 있는 값을 서버로부터 리턴 값을 받아온다.

 

ResponseXML

XML HttpReuqest 객체는 XML 파서가 내장되어 있다.

ResponseXML 프로퍼티는 XML DOM 객체에 대한 응답을 서버로부터 리턴 값을 받는다. 이 프로퍼티는 XML DOM 객체에 응답을 해석한다.

 

서버 응답에 관한 메소드

getAllResponseHeader()

서버로부터 의 응답에 헤더정보를 모두 리턴한다.

getResponseHeader()

서버로부터 의 응답에 헤더정보중 특정 정보만 리턴한다.

 

AJAX를 이용한 XML파일연동