web-dev-qa-db-ja.com

jQueryの$ .ajax（）メソッドをラップして、グローバルエラー処理を定義します

this one のような質問から分岐して、jQueryの$ .ajax（）メソッドをラップして、1つの場所でエラー処理を提供できるようにします。これにより、すべてのアプリケーションで自動的に使用されます。リモート呼び出し。

簡単なアプローチは、$。get（）と$ .post（）が$ .ajax（）にファサードを実装する方法と同様に、新しい名前を作成することです。ただし、$。ajax（）という名前を再利用して、標準のjQuery構文を使用して残りのコードを保持できるようにし、独自のエラー処理を追加したという事実を隠したいと思っています。これは実用的および/または達成するのに良いですか、それとも恐ろしい考えですか？

編集：これまでの応答は、.ajaxError（）が進むべき道であることを示しています。これで400および500レベルのエラーがキャッチされることはわかっていますが、（このイベントハンドラーなどを使用して）302リダイレクトもキャッチする方法はありますか？ログインページにリダイレクトする応答を処理しようとしていますが、XHRリクエストの場合はそのリダイレクトをインターセプトして、ユーザーがアクションを自動的に転送するのではなくキャンセルできるようにします。

jqueryajaxcustom-exceptions
22
Marc L

$.ajaxError を確認することをお勧めします。

$(document).ajaxError(function myErrorHandler(event, xhr, ajaxOptions, thrownError) {
  alert("There was an ajax error!");
});

jQueryは グローバルハンドラーをアタッチする他の多くの方法 を提供します。

編集に答えるために、$.ajaxSuccessで成功したajaxリクエストをキャッチでき、$.ajaxCompleteですべて（成功と失敗）をキャッチできます。次のように、xhrパラメータから応答コードを取得できます。

$(document).ajaxComplete(function myErrorHandler(event, xhr, ajaxOptions, thrownError) {
  alert("Ajax request completed with response code " + xhr.status);
});
28
sje397

jQueryには$ .ajaxSetup（）と呼ばれる便利なメソッドがあり、その後に続くすべてのjQueryベースのAJAXリクエストに適用されるオプションを設定できます。このメソッドをメインのドキュメント準備関数に配置することで、すべての設定は、残りの機能に自動的に1か所で適用されます

$(function () {
    //setup ajax error handling
    $.ajaxSetup({
        error: function (x, status, error) {
            if (x.status == 403) {
                alert("Sorry, your session has expired. Please login again to continue");
                window.location.href ="/Account/Login";
            }
            else {
                alert("An error occurred: " + status + "nError: " + error);
            }
        }
    });
});

参照： https://cypressnorth.com/programming/global-ajax-error-handling-with-jquery/

2
SHIBIN

実際、jQueryはこの目的のためだけにフック .ajaxError() を提供します。 $ajaxError()でバインドしたすべてのハンドラーは、ページからのajaxリクエストがエラーで完了すると呼び出されます。セレクターを指定すると、.ajaxError()ハンドラー内でthisを参照できます。

これを使用してページ上のすべてのajaxリクエストエラーを処理し、thisを使用してdocumentを指すには、次のようにします。

$(document).ajaxError(function(event, request, settings){
   alert("Error requesting page: " + settings.url);
});
1
Alex

それは悪い考えだと思います。 $.ajaxをラッピングするのは問題ないと思いますが、あなたは再定義それについて話しているのです。これに気付いていない人は、予期しない結果を得るでしょう。

他の人が述べているように、ハンドラーを$.ajaxErrorにバインドするのが方法です。

0
Rob Sobers