본문 바로가기

기타

AJAX 연결 라이브러리 구현하기~!

우리는 자주 쓰는 루틴을 알고리즘 또는 함수, 이런 형태로 만듭니다.
왜일까요? 반복적으로 쓰니까요.
코딩하는 관점에서 효율적인 프로그래밍이라는 것, 어찌보면, 몸이 편하는 방향으로 가게 되면 되지 않을까 합니다. ^.^

AJAX 프로그래밍하는데 가장 빈번하게 쓰이거나 공통적으로 사용하는 것이 뭐가 있을까요?

저는 3가지로 꼽아보고 싶습니다.
1. XMLHttpRequest 인스턴스 변수 선언
2. XMLHttpRequest 인스턴스 변수 셋팅하기
3. Request 함수 호출

이 된다고 생각이 드는군요.. (기초적인 수준부터 보자면은~!)

이 3가지를 하나의 라이브러리로 모아놓고,
라이브를 필요한 Ajax 프로그래밍때, 가져다 쓰면 되겠네요~

이 라이브러리를 만들기 위해서,
"Ajax에서 상태 변화시 호출되는 함수를 함수명으로 지정하기."와 같은 글들을 이전에 적은 것입니다.
위의 내용은 위에서 3가지로 꼽은 사항 중 3번에 해당하는 것이므로,
혹시 모르신다면 읽어보시기 바랍니다.

Ajax는 자바스크립트 코드로 되어 있습니다.
그렇기 때문에 "연결 라이브러리"를 만든다면 자바스크립트 코드 " .js " 파일을 만드는 것입니다.
그리고 저는 이 라이브러리 파일명을 AjaxLib.js 라고 짓겠습니다. ^^ <- 마음대로 지어주세요~~

그럼 이 자바스크립트 파일에 위의 3가지 사항들을 다 적용해보죠.

//1. XMLHttpRequest 인스턴스 변수 선언
var xmlHttp;

//2. XMLHttpRequest 인스턴스 변수 셋팅하기
function createXMLHttpRequest()
{
     if(window.AciveXObject) {
          xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
     } else if (window.XMLHttpRequest) {
          xmlHttp = new XMLHttpRequest();
     } else {
          xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
     }
}

//3. Request 함수 호출
function startRequest(type, url, fName) {
         createXMLHttpRequest();
         xmlHttp.onreadystatechange = eval(fName);
         xmlHttp.open(type, url, true);
         xmlHttp.send(null);
}

메모장이나 기타 등등의 프로그램으로 제작하시면 됩니다.
저의 경우에는 이클립스를 씁니다. ^.^ 요즘에는 좀 쓰게 되더라고요.

이제 AjaxLib.js 파일을 만들었습니다. 별거아니죠?? ^^ 이전에 조금씩 조금씩 설명드리며 했던걸.. 공통적으로 쓰이는 부분만 쏙~쏙~ 뽑아서 모아놓은 거니까요...

그럼 이제 이 AjaxLib.js을 가져다 쓸 수 있어야 하겠죠??
HTML이나, JSP, PHP, ASP 등에서 이를 가져다 쓰려면,
그저~

<script language="javascript" type="text/javascript" src="AjaxLib.js"></script>

한줄만 추가해주시면 됩니다.

그럼, Ajax 프로그래밍할때 꼭~~ XMLHttpReqeust... 이렇게 긴... 문장 반복적으로 치지 않아도 되고 편리하게 사용하실 수 있습니다.~!

반응형