본문으로 바로가기

cors jsonp 형식으로 ajax 처리하기

category Frontend/Javascript 2020. 7. 18. 10:16

cors jsonp 형식으로 ajax 처리하기

첫번째, 요청 URL뒤에 ?callback=? 추가하여 jsonp 요청 구현하기

$.getJSON("http://www.codejs.co.kr/jsonp.json?callback=?",  
    function(data) {  
        console.log('성공 - ', data);  
    }  
);  

두번째, 응답 json에 callback함수로 한번 감싸서 jsonp 구현하기

$('a').click(function() {  
    $.ajax({  
        url: "http://www.codejs.co.kr/jsonp.json",
        dataType: 'jsonp',  
        jsonpCallback: "myCallback",  
        success: function(data) {  
            console.log('성공 - ', data);  
        },  
        error: function(xhr) {  
            console.log('실패 - ', xhr);  
        }  
    });  
});  

세번째, jsonpCallback 옵션없이 사용하기.

$('a').click(function() {  
    $.ajax({  
        url: "http://www.codejs.co.kr/jsonp.json",
        dataType: 'jsonp',  
        success: function(data) {  
            console.log('성공 - ', data);  
        },  
        error: function(xhr) {  
            console.log('실패 - ', xhr);  
        }  
    });  
});  

글쓴이는 첫번째 방법으로 사용함