jQuery

[기초] AJAX XMLHttpRequest

ethanjoh 2009. 7. 28. 21:18
AJAX는 XMLHttpRequst 객체를 사용한다.


지금까지 자바스트립트에서는 서버에 있는 데이터베이스나 파일에서 정보를 주고 받으려면, HTML 폼을 만들어야 하고 사용자가 정보를 주고 받으려면 "제출하기" 버튼을 누른 뒤 서버의 응답을 기다리고 그 다음에 새로운 페이지에서 결과를 뿌려준다. 그렇기 때문에 사용자가 입력을 하고 전송할 때마다 서버는 새로운 페이지를 돌려보내게 되므로 기존의 웹 응용프로그램들은 느리게 동작할 뿐 아니라 덜 사용자 친화적이다. (주: 회원가입하는 과정을 상상해 보면 금방 이해가 간다.)

AJAX에서는 XMLHttpRequest 객체를 통해 자바스크립트가 서버와 직접적으로 통신한다.

XMLHttpRequst 객체는 페이지를 새로고침하지 않고도 웹페이지가 서버에 요청을 보내고 응답을 받을 수 있도록 해준다. 사용자는 같은 페이지에 머물게 되고 스크립트가 페이지를 요청했는지 또는 백그라운드에서 서버에 데이터를 보냈는지 조차 눈치채지 못한다.

XMLHttpRequest 객체


XMLHttpRequest 객체를 사용해서 웹 개발자는 페이지를 불러온 상태에서 서버로부터 데이터를 가져와 페이지를 갱신할 수 있다!

AJAX는 구글에 의해(구글 제시어) 2005년 무렵 유명해졌다.

구글 제시어는 XMLHttpRequest 객체를 사용해 매우 동적인 웹 인터페이스를 만든다: 구글이 검색창에 단어입력을 시작할 때, 자바스크립트는 서버에 사용자가 알지 못하는 사이 입력 문자를 보내고 서버는 제시어 리스트를 돌려준다.

XMLHttpRequest 객체는 최근의 주요 브라우저들(인터넷 익스플로러, 파이어폭스, 크롬, 오페라, 사파리)이 모두 지원한다.