Java Script & DOM/Ajax

동기화 여부에 따른 처리 방법

본클라쓰 2010. 4. 29. 08:56

 

Ajax 사용하여 서버에 데이터를 요청할 때 동기화 여부를 지정할 수 있다. 비동기화 통신은 open() 메소드의 세 번째 인자의 값을 'true'로 주고, 동기화 통신은 open() 메소드의 세 번째 인자값을 'false'로 준다.

 

비동기화 통신은 요청을 보낸 후 서버의 응답을 기다리지 않고 다른 작업을 수행하다 서버의 응답이 오면 응답 코드에 따라 수행해야 할 부분을 처리하는 방식으로 동작한다. 비동기화 통신은 무리한 서버 사용으로 인해 서버의 응답이 늦을 경우를 신경쓰지 않고 클라이언트의 나머지 부분을 수행할 수 있다는 장점을 가지고 있으며 Ajax 에서는 일반적으로 비동기 통신을 사용한다.

 

동기화 통신은 서버에 요청을 보낸 후 대기하고 있다가 서버의 응답이 오면 나머지 부분을 실행하는 방법으로 동작한다. 동기화는 서버 처리 결과와 화면에 결과과 일치해야 할 경우나 처리 절차가 순차적으로 진행되어야 하는 경우에 사용된다. 따라서 비동기화 통신과 동기화 통신에 따른 처리 방법도 다르다.

 

 

 

■ 동기화 통신 처리 방법 

 

동기화 통신 처리는 순차적인 처리 작성 방법을 따른다. opne()메소드를 사용하여 요청을 준비하고 send() 메소드를 사용하여 요청을 보낸 후 처리 결과를 send() 메소드 아래에 바로 작성하는 방법이다.  

 

xmlhttp.open("GET" , "ajax_test.txt" , false);
xmlhttp.send();
document.getElementById("결과 표시 영역").innerHTML=xmlhttp.responseText;

 

 

 

■ 비동기화 통신 처리 방법

 

비동기화 통신 처리는 XMLHttpRequest 객체의 onreadystatechange 함수를 재정의 하는 것으로 처리한다. onreadystatechange 함수에 응답상태에 따른 처리 방법을 작성한다. 서버의 응답 코드는 XMLHttpRequest 객체의 readyState 속성에 저장되어 있다. 위의 예제는 서버의 응답이 완료되었을 경우 처리하는 방법을 작성해 놓은 것이다.

 

xmlhttp.onreadystatechange = function() {
    if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
        document.getElementById("결과 표시 영역").innerHTML=xmlhttp.responseText;
    }
}
xmlhttp.open("GET","ajax_info.txt",true);
xmlhttp.send();

 

 

'Java Script & DOM > Ajax' 카테고리의 다른 글

XML 데이터 처리 방법  (0) 2010.04.29
onreadystatechange 이벤트  (0) 2010.04.29
서버의 응답 얻기  (0) 2010.04.28
서버로 요청 보내기  (0) 2010.04.28
XMLHttpRequest 객체 설명  (0) 2009.10.19