web-dev-qa-db-ja.com

AJAX呼び出しからのエラーをどのように処理しますか?

次のjQueryがあるとしますAJAX呼び出し:

$.ajax({
   type: "POST",
   url: "MyUrl",
   data: "val1=test",
   success: function(result){
        // Do stuff
   }
 });

ここで、AJAX=呼び出しが行われたときに、サーバー側のコードでいくつかのエラー処理チェックを実行します(たとえば、ユーザーがまだログインしている場合、この呼び出しを使用する権限がありますか)データは有効などです)。エラーが検出された場合、そのエラーメッセージをクライアント側にバブリングするにはどうすればよいですか?

私の最初の考えは、2つのフィールド(errorとerrorMessage)を持つJSONオブジェクトを返すことでした。これらのフィールドは、jQuery AJAX呼び出しでチェックされます。

$.ajax({
   type: "POST",
   url: "MyUrl",
   data: "val1=test",
   success: function(result){
       if (result.error == "true") 
       {
           alert("An error occurred: " & result.errorMessage);
       }
       else 
       {
           // Do stuff
       }
   }
 });

これは少し不格好に感じますが、うまくいきます。より良い代替案はありますか?

24
Kevin Pang

個人的に、私は自分のライブラリーに次のようなコードを持っています。

$.ajaxSetup({
    error: function(xhr){
        alert('Request Status: ' + xhr.status + ' Status Text: ' + xhr.statusText + ' ' + xhr.responseText);
    }
});

jQuery docs Ajax/jQuery.ajaxSetup

(phpを使用して)サーバー側からクライアント側にエラーをバブリングする最良の方法は、400年代のどこかでAjaxリクエストを介してヘッダーを送信することです(これは常にエラーに関連付けられています)。 Ajaxリクエストがこれを受信すると、エラー関数がトリガーされます。これは、エラーを定義する必要がないことも意味します。すべての$ .ajax呼び出しで呼び出します。

header('HTTP/1.0 419 Custom Error');

w3.orgヘッダー情報 からの引用

エラー4xx、5xx 4xxコードは、クライアントにエラーが発生したと思われる場合を想定しており、サーバーがサーバーにエラーを認識した場合に5xxコードを使用します。これらのケースを一般的に区別することは不可能であるため、違いは情報提供のみです。本文セクションには、人間が読める形式でエラーを説明するドキュメントを含めることができます。文書はMIME形式であり、text/plain、text/html、またはリクエストで受け入れられると指定された形式の1つのみである可能性があります。

25
Asciant
$.ajax({
   type: "POST",
   url: "MyUrl",
   data: "val1=test",
   success: function(result){
        // Do stuff
   },
   error: function(request,status,errorThrown) {
        // There's been an error, do something with it!
        // Only use status and errorThrown.
        // Chances are request will not have anything in it.
   }
 });
6
Salty

JQuery ajax関数は、最後にもう1つのパラメーター、失敗した呼び出しのコールバックを受け入れませんか?その場合は、成功コールバックの後にfail:function(...){..}を追加するだけです。

3
rodbv

HTTPエラーを使用してサーバー側でエラーコードを返します。エラーが何であるかを最もよく表します。次に、エラーコールバックを使用します。これにより、ウェブサーバーからのエラーを表示することもできます。

0
Adam Peck

この質問に答えるのはかなり遅いですが、es6とjquery 2.2を使用している人にとっては有益だと思います。

私は通常、コードでこれに従います(遅延アプローチ)

sendAjaxRequest(URL, dataToSend) {
    return $.ajax({
        type        : 'POST',
        url         : URL,
        data        : JSON.stringify(dataToSend),
        dataType    : 'json'
    }).fail((responseData) => {
        if (responseData.responseCode) {
            console.error(responseData.responseCode);
        }
    });
},

エラーが発生した場合に呼び出される遅延failメソッドをアタッチしました。これは、エラーコールバックオプションの代替構成です。fail()メソッドは、最新のjqueryで非推奨の.error()メソッドを置き換えます。

次にsendAjaxRequestを呼び出す場所からthen jquery promise callbackを使用します

sendAjaxRequest(URL, dataToSend)
.then(
     (success) => {
     },
     (error) => {
     }
);

サーバーから受信した応答に基づいて、成功またはエラー関数を呼び出します。

0
WitVault