【ajax】通信エラーとなった原因の取得方法

Ajax通信を利用しようとした際にアラートでエラー表示されたものの、どこでエラーが起こっているのか原因がわからないということがあった。 それを解決するための手段を以下にまとめた。 まず、jQuery1.4以前はjQueryのAjax通信の書き方は以下のようであった。

$.ajax({
    url: "ajax.html",
    success: function(data) {
       alert('success!!');
    },
    error: function(data) {
       alert('error!!!');
    }
});

jQuery1.5以降では、

$.ajax({
    url: "ajax.html",
}).success(function(data) {
    alert('success!!');
}).error(function(data) {
    alert('error!!!');
});

と少し変更が行われ、簡潔に確認できるようになった。 ここからが本題だが、このコードではAjax通信でエラーが起こった際には、「error!!!」としか表示されず、どこでエラーが起こったのか確認することが出来ない。 しかし、以下のように変更することによってエラーの確認を行うことができる。

$.ajax({
    url: "ajax.html",
}).success(function(data) {
    alert('success!!');
}).error(function(XMLHttpRequest, textStatus, errorThrown) {
    alert('error!!!');
　　console.log("XMLHttpRequest : " + XMLHttpRequest.status);
　　console.log("textStatus     : " + textStatus);
　　console.log("errorThrown    : " + errorThrown.message);
});

XMLHttpRequest.status、textStatus、errorThrown.messageはそれぞれ以下を表している。

・XMLHttpRequest.status：HTTPリクエストのステータスの取得
・textStatus：タイムアウト、パースエラー等のエラー情報の取得
・errorThrown.message：例外情報の取得

これらを実行した結果、コンソールログに以下の表示がされたら、存在しないページにajax通信を行ったことを示している。

XMLHttpRequest : 404
textStatus : error
errorThrown : undefine

また、コンソールログに以下の表示がされたら、サーバーサイドでパースエラーが起きている。

XMLHttpRequest : 200
textStatus : parsererror
errorThrown : JSON.parse: unexpected character at line 1 column 1 of the JSON data