AJAX의 구성 요소

1) AJAX : Asynchronous JavaScript + XML
JavaScript를 사용한 비동기 통신, 클라이언트와 서버간에 XML 데이터를 주고받는 기술

2) AJAX 장점
-페이지 이동 없이 고속으로 화면 전환
-서버 처리를 기다리지 않고 비동기 요청이 가능
-서버 측 처리를 각 PC에 분산 가능
-수신하는 데이터의 양을 줄임

3) AJAX 단점
-크로스 브라우저화의 노하우 필요
-AJAX를 사용하지 못하는 브라우저
-오픈 소스이므로 차별화가 어려움
-보안에 더욱 신경을 써야 함

4) 기존방식과 AJAX의 차이
1, 기존방식
- 웹 브라우저가 웹 서버에 요청 전송
- 웹 서버는 JSP 등의 서버 어플리케이션을 사용해 사용자의 요청 처리 후 결과를 HTML로 생성해서 웹 브라우저에 전송
- 웹 브라우저는 응답으로 받은 HTML을 분석한 뒤 그 내용을 화면에 그림
- 결과적으로 웹 브라우저가 웹 서버와 통신을 하고 요청 결과는 HTML로 생성되고 사용자 입장에서는 페이지 이동이 발생함

2. AJAX방식
- 사용자가 이벤트를 발생 > 자바스크립트는 DOM을 사용해서 필요한 정보를 구한 뒤, XMLHttpRequest 객체를 통해서 웹 서버에 요청을 전달
- 웹 서버는 XMLHttpRequest로부터의 요청을 알맞게 처리후 결과를 XML이나 단순 Text을 생성해서 XMLHttpRequest에 전송
- 서버로부터 응답이 도착하면 XMLHttpRequest 객체는 자바스크립트에 도착 사실을 알고 자바스크립트는 응답 데이터와 DOM을 이용해 사용자 화면에 반영
- 결과적으로 사용자 입장에서는 페이지 이동이 발생되지 않고 페이지 내부 변화만 일어남



5) AJAX의 주요 구성 요소
- XMLHttprequest : 웹서버와 통신을 담당함. 사용자의 요청을 웹서버에 전송 및 웹서버로부터 받은 결과를 웹브라우저에 전달함
- DOM : 문서의 구조를 나타냄, 폼 등의 정보나 화면 구성을 조작할때 사용함
- CSS : 글자색,배경색,위치,투명도 등 UI관련 부분을 담당
- 자바스크립트 : 사용자가 마우스를 드래그하거나 버튼을 클릭하면 XMLHttpRequest객체를 사용해 웹서버에 요청을 전송함.
XMLHttpRequest 객체로부터 응답이 오면 DOM, CSS등을 사용해 화면을 조작함.

* refrence

• http://hieroglyph.tistory.com/13