Ajax: 개요

AJAX (Asynchronous Javascript And Xml)

 

비동기식 자바스크립트와 xml.

xml 객체를 이용하여 페이지의 일부만 수정하여 전체를 새로 고치지 않아도 일부만 로드할 수 있다.

 

* 비동기 방식 : 웹페이지를 전체 리로드하지 않고 데이터를 불러오는 방식

 

 

데이터 형태

1. TEXT.txt

2. HTML.html

3. XML.xml

4. JSON.json

5. script.js

6. php, asp, java

 

 

장,단점

 

• 장점

1. 웹페이지의 속도향상
2. 서버의 처리가 완료될 때까지 기다리지 않고 처리가 가능하다.
3. 서버에서 Data만 전송하면 되므로 전체적인 코딩의 양이 줄어든다.
4. 기존 웹에서는 불가능했던 다양한 UI를 가능하게 해준다. ( Flickr의 경우, 사진의 제목이나 태그를 페이지의 리로드 없이 수정할 수 있다.)

 

• 단점

1. 히스토리 관리가 되지 않는다.
2. 페이지 이동없는 통신으로 인한 보안상의 문제가 있다.
3. 연속으로 데이터를 요청하면 서버 부하가 증가할 수 있다.
4. XMLHttpRequest를 통해 통신하는 경우, 사용자에게 아무런 진행 정보가 주어지지 않는다. (요청이 완료되지 않았는데 사용자가 페이지를 떠나거나 오작동할 우려가 발생하게 된다.)
5. AJAX를 쓸 수 없는 브라우저에 대한 문제 이슈가 있다.
6. HTTP 클라이언트의 기능이 한정되어 있다.
7. 지원하는 Charset이 한정되어 있다.
8. Script로 작성되므로 디버깅이 용이하지 않다.
9. 동일-출처 정책으로 인하여 다른 도메인과는 통신이 불가능하다. (Cross-Domain문제)

 

 

구성요소

1. HTML, CSS: 웹페이지 표현
2. DOM 모델 : 데이터에 접근하거나 화면구성을 동적으로 조작
3. JSON, XML: 데이터 교환
4. XMLHttpRequest: 서버와 비동기식 통신
5. Javascript : 위의 모든 기술을 결합, 사용자의 작업 흐름 제어

 

 

동작 원리

 

 

* 출처 및 참고 : tcpschool.com/ajax/ajax_intro_works