[Javascript] Ajax 요청

Ajax 요청

요즘은 웹 서비스를 만든다하면 거의 RESTful하게 만들기 때문에, 프론트단에서의 Ajax 요청을 하는 코드를 많이 작성하게 된다.

Ajax 함수는 jQuery 라이브러리에서 제공하는 함수이다.

$.ajax({
        url: "/board/write",
        type: "post",
        dataType: "json",
        contentType: "application/json",
        data: JSON.stringify(requestData),
        success: function(resultData) {
            // TODO : 결과로 받은 resultData로 작업 !
        },
        error: function(jqXHR, textStatus, errorThrown) {
            // 에러 로그는 아래처럼 확인해볼 수 있다. 
            alert("업로드 에러\ncode : " + jqXHR.status + "\nerror message : " + jqXHR.responseText);
        }
});

 

GET 메서드로 요청을 보내고 JSON으로 결과 데이터를 받아오고 싶다면, 아래의 함수로 간략하게 작성할 수도 있다.

첫 번째 파라미터는 URL, 두 번째 파라미터는 보낼 데이터, 세 번째 파라미터는 요청이 성공적일 때 실행할 함수

$.getJSON("/board/write", { boardIdx : boardIdx }, function(obj) {
        console.log("요청 SUCCESS - 결과 데이터 : " + obj);
        // do somthing ...
});