jQuery - $.get() 와 $.post()

클라이언트와 서버 간의 요청과 응답에 사용되는 일반적인 방법은 GET 과 POST 입니다. POST 방식은 서버에 요청을 보낼 경우 데이터를 캐시하지 않는 반면 GET 방식은 캐시됩니다. 형식은 다음과 같습니다.

// GET 전송시
$.get(url [, data] [, callback] [, dataType]);

// POST 전송기
$.post(url, [, data] [, callback] [, dataType]);

POST 나 GET 방식에 사용할 수 있는 속성은 다음 표를 참고합니다.

속 성	설 명
url	전송될 URL. 필수 선택
data	서버에 요청을 보낼 때 파라미터 값. 선택사항
callback	전송 완료 후 실행할 콜백 함수. 선택사항
dataType	데이터 받아올 때의 데이터의 형식을 지정. 선택사항 xml, json, script, text, html 중 하나.

POST 와 GET 요청시 함께 사용할 수 있는 메소드는 .done(), .fail(), .always() 이며 버전 1.5부터 사용할 수 있습니다. 요청이 종료될 때 호출하는 함수입니다.

메소드	설 명
.done()	요청 성공시 실행할 콜백 함수
.fail()	요청 실패시 실행할 콜백 함수
.always()	요청 완료/성공시 실행할 콜백 함수

// URL 만 요청하는 경우
$.get("example.php");

// URL 과 data 를 함께 요청하는 경우
$.get("example.php", {name: '하보니', age: 20, jop: 'IT'});

// URL 과 콜백 함수로 요청하는 경우
$.get("example.php", function(data, status){
  console.log("data:" + data);
  console.log("Status:" + status);
})

반환 값은 받아올 수 없지만 추가적인 데이터는 아래와 같이 전송할 수 있습니다.

// GET 와 POST 방식에 사용할 수 있습니다.
$.get("example.php", {name: '하보니', age: 20, job: 'IT'});

or

// GET 방식에만 파라미터를 넘길 수 있습니다.
$.get("example.php?name=하보니&age=20&job=IT");

아래는 반환 값을 받아오는 예제입니다. url 에 data 와 함께 전송한 결과이며, test.php 파일 내용에는 단순히 print_r($_GET); 로 하였습니다.

<!-- 
test.php 의 예제

<?php
print_r($_GET);
?>
//-->


<script>
$(function(){
 $("button").click(function(){
   $.get("test.php?user=habony", 
     {name:'하보니', age:20, job:'IT'}, 
     function(data){
       $("#user").html(data);
     });
 });
});
</script>

<button>ajax 받아오기</button>

<div id="user"></div>
<!-- 
결과:

Array (
 [user] => habony
 [name] => 하보니
 [age] => 20
 [job] => IT
)
//-->

.done(), .fail(), .always() 메소드는 요청이 이미 완료되면 즉시 콜백 함수가 시작됩니다.

<script>
$(function(){
 $("button").click(function(){
   $.get("test.php?user=habony", function(data){
     $("#user").html(data);
   })
   .done(function(){
     console.log("요청이 성공하였습니다.");
   })
   .fail(function(){
     console.log("알수없는 에러가 발생하였습니다.");
   })
   .always(function(){
     console.log("응답이 완료하였습니다.");
   });
 });
});
</script>