web-dev-qa-db-ja.com

JSONPリクエストエラー処理

私はajax jsonpリクエストを作成していますが、失敗エラー処理は機能しません。要求が404または500の場合、エラーは処理されません。

私はこれに対する答えを見つけるために周りを見回してきましたが、何も見つかりません。 http://code.google.com/p/jquery-jsonp/ で解決策があるようですが、使用方法の例は見つかりません。

function authenticate(user, pass) {       
    $.ajax ({
        type: "POST",
        url: "url",
        dataType: 'jsonp',
        async: false,
        //json object to sent to the authentication url
        data: {"u": userid, "p": pass},

        success: function (data) {
            //successful authentication here
            console.log(data);
        },
        error: function(XHR, textStatus, errorThrown) {
            alert("error: " + textStatus);
            alert("error: " + errorThrown);
        }
    })
}
jqueryajaxjsonerror-handlingjsonp
38
Adrian Mojica

エラーを処理する2つの方法、

  1. クロスドメインJSONPリクエストのエラー処理はありません。 Githubで利用可能なjsonpプラグインを使用します https://github.com/jaubourg/jquery-jsonp エラー処理のサポートを提供します。

  2. jQuery ajaxタイムアウト-エラーコールバックがサイレントに失敗した可能性があるため、エラーコールバックを起動するための妥当な時間後のタイムアウト。実際のエラー（またはエラーステータス）が何であるかはわからないかもしれませんが、少なくともエラーを処理することができます。

36
shyammtp

jQuery.ajax（）documentation をチェックすると、以下を見つけることができます：

エラー

リクエストが失敗した場合に呼び出される関数（...）注：このハンドラーはnotクロスドメインスクリプトおよびクロスドメインJSONPリクエストに対して呼び出されます。これはAjaxイベントです。

そのため、回避策を見つける必要があります。エラーコールバックをトリガーするタイムアウトを指定できます。これは、指定された時間内にリクエストが正常に完了することを意味します。それ以外の場合は、失敗したと想定します。

$.ajax({
    ...
    timeout: 5000, // a lot of time for the request to be successfully completed
    ...
    error: function(x, t, m) {
        if(t==="timeout") {
            // something went wrong (handle it)
        }
    }

});

コードのその他の問題...

[〜＃〜] jsonp [〜＃〜] （look here and here ）は、Originポリシーの制限を克服するために使用できますが、 't POST JSONPを使用（代わりに [〜＃〜] cors [〜＃〜] を参照）それは単に そのように動作しない -データを取得する要素を作成します。これはGETリクエストを介して実行する必要があります。JSONPソリューションはXmlHttpRequestオブジェクトを使用しないため、標準的な方法でのAJAXリクエストではありません理解しますが、コンテンツは引き続き動的にアクセスされます-エンドユーザーに違いはありません。

$.ajax({
    url: url,
    type: "GET"
    dataType: "jsonp",
    ...

次に、データを誤って提供します。シリアル化されたJSON表現ではなく、javascriptオブジェクト（オブジェクトリテラルを使用して作成された）をワイヤにプッシュしています。 JSON文字列を作成します（手動ではなく、JSON.stringifyコンバーターを使用します）：

$.ajax({
    ...
    data: JSON.stringify({u: userid, p: pass}),
    ...

前号では、asyncをfalseに設定しましたが、ドキュメントには次のように記載されています：

クロスドメインリクエストとdataType： "jsonp"リクエストは、同期操作をサポートしていません。

53
jwaliszko

私はしばらくの間、ajax jsonp DataTypeリクエストのエラーを処理しようとして苦労していましたが、コードを共有したいと思います。基本的なことは、ajaxリクエストにタイムアウトを含めることです。そうしないと、エラーが入力されることはありません。

$.ajax({
url: "google.com/api/doesnotexists",
dataType: "jsonp",
timeout: 5000,

success: function (parsed_json) {
console.log(parsed_json);
},

error: function (parsedjson, textStatus, errorThrown) {
console.log("parsedJson: " + JSON.stringify(parsedjson));

$('body').append(
    "parsedJson status: " + parsedjson.status + '</br>' + 
    "errorStatus: " + textStatus + '</br>' + 
    "errorThrown: " + errorThrown);        

 }
});

jsfiddle-jquery ajax呼び出しとJSONP dataTypeでエラーを処理する-エラー404

10
Mikeldi

私はjquery-jsonpを使用する脆弱なJSプロジェクトを構築しており、どのメソッドが使用されてもエラーを処理するデュアルjsonp/ajaxアプローチを思いつきました。

function authenticate(user, pass) {
    var ajax = ($.jsonp || $.ajax)({
        'url': /* your auth url */,
        'data': { /* user, pass, ... */ },
        'contentType': "application/javascript",
        'dataType': 'jsonp',
        'callbackParameter': 'callback'  // $.jsonp only; $.ajax uses 'jsonpCallback'
    });
    ajax.done(function (data) {
        // your success events
    });
    ajax.fail(function (jqXHR, textStatus, errorThrown) {
        // $.jsonp calls this func as function (jqXHR, textStatus)
        // and $.ajax calls this func with the given signature
        console.error('AJAX / JSONP ' + textStatus + ': ' +
            (errorThrown || jqXHR.url));
    });
}

Jquery-jsonpと$ .ajaxの両方がjQuery Deferred仕様をサポートしているため、2つのエラーハンドラーをマージして、400および500シリーズのエラーとルックアップタイムアウトを処理できます。

2
Brian

古い質問ですが、私は同じ問題を抱えていました。ここに私のために働いた解決策があります。

ownリクエストを撮影するドメインの場合、応答に変数を設定し、クライアント側でそれを確認できます。

サーバ側：

SERVER_RESPONSE=true; Callback(parameter1, parameter2);

クライアント側：

if(typeof SERVER_RESPONSE === 'undefined'){
  console.log('No Response, maybe server is down');
}
else{
  console.log('Got a server response');
}
0
Markus