jQuery AJAX를 통한 JSONP 콜백 기능

jQuery AJAX를 통한 JSONP 콜백 기능

저는 jQuery의 agax 함수에 대한 콜백 작업 방법을 잘 이해하지 못했습니다.

JavaScript에 다음 코드가 있습니다.

try {
    $.ajax({
        url: 'http://url.of.my.server/submit?callback=?',
        cache: false,
        type: 'POST',
        data: $("#survey").serialize(),
        dataType: "jsonp",
        timeout: 200,
        crossDomain: true,
        jsonp: 'jsonp_callback',
        success: function (data, status) {
            mySurvey.closePopup();
        },
        error: function (xOptions, textStatus) {
            mySurvey.closePopup();
        }
    });
} catch (err) {
    mySurvey.closePopup();
}

그리고 서버 측(AppEngine / Python)에서 콜백 매개 변수의 값을 가져오고 다음과 같이 응답합니다.

self.response.headers['Content-Type'] = 'application/json; charset=utf-8'
self.response.out.write(callback + '({"msg": "ok"});')

하지만 그 다음엔"Error: jQuery152042227689944248825_1317400799214 is not a function"검색할 수 있습니다.

이 일을 처리하는 적절한 방법은 무엇입니까?지금 당장은 필요한 결과를 얻지만, 그것이 옳지 않다는 것을 알고 있다는 사실이 저를 괴롭힙니다.

이것이 내가 내 것에서 하는 것입니다.

$(document).ready(function() {
  if ($('#userForm').valid()) {
    var formData = $("#userForm").serializeArray();
    $.ajax({
      url: 'http://www.example.com/user/' + $('#Id').val() + '?callback=?',
      type: "GET",
      data: formData,
      dataType: "jsonp",
      jsonpCallback: "localJsonpCallback"
    });
  });

function localJsonpCallback(json) {
  if (!json.Error) {
    $('#resultForm').submit();
  } else {
    $('#loading').hide();
    $('#userForm').show();
    alert(json.Message);
  }
}

이 줄 삭제:

jsonp: 'jsonp_callback',

또는 이 줄을 바꿉니다.

url: 'http://url.of.my.server/submit?callback=json_callback',

왜냐하면 현재 당신은 jQuery에 임의의 콜백 함수 이름을 만들 것을 요청하고 있기 때문입니다.callback=?그런 다음 jQuery에 사용하고 싶다고 말합니다.jsonp_callback대신.

$.ajax({
        url: 'http://url.of.my.server/submit',
        dataType: "jsonp",
        jsonp: 'callback',
        jsonpCallback: 'jsonp_callback'
    });

jsonp는 서버에서 허용하도록 정의된 쿼리 문자열 매개 변수 이름이고 jsonpCallback은 클라이언트에서 실행할 javascript 함수 이름입니다.
이러한 URL을 사용하는 경우:

url: 'http://url.of.my.server/submit?callback=?'

끝에 있는 물음표 ?는 jQuery에 임의 함수를 생성하도록 지시하는 반면, 자동 생성 함수의 미리 정의된 동작은 콜백(이 경우 성공 함수)만 호출합니다. json 데이터를 매개 변수로 전달합니다.

$.ajax({
        url: 'http://url.of.my.server/submit?callback=?',
        success: function (data, status) {
            mySurvey.closePopup();
        },
        error: function (xOptions, textStatus) {
            mySurvey.closePopup();
        }
    });

$.getJ를 사용하는 경우에도 마찬가지입니다.? 자리 표시자가 있는 SON은 임의 함수를 생성하는 반면 자동 생성 함수의 미리 정의된 동작은 콜백만 호출합니다.

$.getJSON('http://url.of.my.server/submit?callback=?',function(data){
//process data here
});

언급URL : https://stackoverflow.com/questions/7613815/callback-function-for-jsonp-with-jquery-ajax