ページ上のすべての ajax 応答をキャッチするコードを書いています。javascript ダイレクト ajax の XMLHttpRequest.onreadystatechange をオーバーライドするか、jQuery ajax の ajaxComplete() を使用して、これを行うことができました。
新しい XMLHttpObject を作成せずに ajax を複数回使用しようとすると、問題が発生します。次に例を示します。
var xhr = new XMLHttpRequest();
xhr.open("GET", '/echo/json/', true);
xhr.send();
xhr.open("GET", '/echo/json/', true);
xhr.send()
これにより、コードが混乱し、最大スタック エラーが発生します。
JSFiddle での私のテスト コードは次のとおりです: http://jsfiddle.net/zxCfW/
var s_ajaxListener = {};
s_ajaxListener.tmpSend = XMLHttpRequest.prototype.send;
s_ajaxListener.callback = function () {
console.log('additional state change');
};
XMLHttpRequest.prototype.send = function() {
s_ajaxListener.tmpOnReadyStateChange = this.onreadystatechange;
this.onreadystatechange = function() {
if (s_ajaxListener.tmpOnReadyStateChange){
s_ajaxListener.tmpOnReadyStateChange.apply(this, arguments);
}
if(this.readyState == 4 && this.status == 200) {
s_ajaxListener.callback();
this.onreadystatechange = s_ajaxListener.tmpOnReadyStateChange;
}
};
s_ajaxListener.tmpSend.apply(this, arguments);
};
$(document).ajaxComplete(s_ajaxListener.callback);
これは、ajax 呼び出しが非同期であるため、元の onreadystatechange がデフォルト値にリセットされないために発生すると考えられますが、これを解決する方法がわかりません。