web-dev-qa-db-ja.com

jQueryを使用したJSONPのコールバック関数AJAX

私はjQueryのajax関数のコールバックをどのように扱うかをよく理解していませんでした。

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"ブラウザコンソールで。

これを処理する適切な方法は何ですか？今は必要な結果を得ることができますが、それが正しくないことを知っているという事実は私を悩ませています。

javascriptjqueryajaxjsonp
26
Bani

これは私のものです

$(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);
  }
}
30
atbebtg

この行を削除します：

jsonp: 'jsonp_callback',

または、次の行を置き換えます。

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

現在、jQueryにcallback=?を使用してランダムコールバック関数名を作成し、jQueryにjsonp_callbackを代わりに使用するように指示しているためです。

13
Joe
$.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();
        }
    });


$。getJSONを？で使用している場合も同様です。プレースホルダーはランダム関数を生成しますが、自動生成関数の事前定義された動作はコールバックを呼び出すだけです：

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