Ajax통신의 이해

최준영·2021년 9월 1일
0
post-custom-banner

Ajax (XMLHTTPRequest 통신)


  • 이 기술은 웹에 데이터를 갱신할 때 새로고침 없이 서버로부터 데이터를 받기위해 개발되었다.
  • Ajax 통신으로는 xml, Plain Text, JSON 등 다양한 포맷의 데이터를 주고받을 수 있지만, 일반적으로 사용이 편리한 JSON 포맷으로 데이터를 주고 받는다.

실행코드

function ajax(data) {
 var oReq = new XMLHttpRequest();
 oReq.addEventListener("load", function() {
   console.log(this.responseText);
 });    
 oReq.open("GET", "http://www.example.org/getData?data=data");//parameter를 붙여서 보낼수있음. 
 oReq.send();
}
  • XMLHttpRequest 객체를 생성한 후 open 메서드로 요청을 준비하고, send 메서드로 서버로 보낸다.
  • 요청 처리가 완료되면(서버에서 응답이 오면) load 이벤트가 발생하고, 콜백 함수가 실행된다.
  • addEventListener 함수는 비동기 함수이기 때문에 콜백함수가 실행될 때는 이미 ajax 함수는 반환되고 콜스택에서 사라진 상태이다.
profile
do for me
post-custom-banner

0개의 댓글