자바스크립트 혹은 Ajax 를 이용하여 다른 도메인과 통신을 하려고 하면 브라우져가 오류를 나타냅니다. .
이정책을 Same-Origin Policy 이라고 하여 브라우져에서 다른 도메인으로 접속을 원천적으로 봉쇄하는 정책으로
만약 이런 정책이 없다면 인터넷에는 악성코드들로 가득 채워질 것입니다.
그러나 요즘같이 복잡 다단한 인터넷 환경에서 사이트간 데이터교환이 빈번하게 일어나야하는 상황이 발생합니다.
이를 해결하기 위한 한가지 방법이 JSONP 입니다.
JSONP를 사용하는 방법은 JSON을 사용하는 방법과 매우 유사합니다.
다만 JSONP를 사용하기 위해서는 GET 방식만을 허용하기 때문에 전송되는 데이터 크기 또한 이에 따라 제한 됩니다.
JSONP를 호출하기 위해서는 callback이라는 parameter를 붙여서 호출하여야 하며 서버측 응답에서도 주어진 callback값으로 응답해야만 정상적인 통신이 이루어 짐을 주의 하여야 합니다.
호출 방법
- jQuery getJSON 사용
$.getJSON(url,"callback=?",function(data){
// Success code
});
- jQuery ajax 사용
jQuery.ajax({
type:"GET",
contentType: "application/json; charset=utf-8",
url : "http://yssong.gowit.co.kr/wservicetest.asmx/JsonTest?callback=?",
data: {},
dataType : "jsonp",
success : function(json) {
for(i=0;i<json.length;i++)
{
alert(json[i].name);
}
},
error : function(e) {
alert("error");
}
});
참고
http://beebole.com/blog/general/sandbox-your-cross-domain-jsonp-to-improve-mashup-security/