Buduję aplikację internetową z różnymi bibliotekami JS (AngularJS, OpenLayers, ...) i potrzebuję sposobu na przechwycenie wszystkich odpowiedzi AJAX, aby móc, w przypadku wygaśnięcia sesji zalogowanego użytkownika (odpowiedź wraca ze 401 Unauthorizedstatusem), przekierować go do strony logowania.
Wiem, że AngularJS oferuje interceptorszarządzanie takimi scenariuszami, ale nie byłem w stanie znaleźć sposobu na osiągnięcie takiego wstrzyknięcia do żądań OpenLayers. Więc zdecydowałem się na waniliowe podejście do JS.
Tutaj znalazłem ten fragment kodu ...
(function(open) {
XMLHttpRequest.prototype.open = function(method, url, async, user, pass) {
this.addEventListener("readystatechange", function() {
console.log(this.readyState); // this one I changed
}, false);
open.call(this, method, url, async, user, pass);
};
})(XMLHttpRequest.prototype.open);... który dostosowałem i wygląda na to, że zachowuje się zgodnie z oczekiwaniami (testowałem go tylko na ostatnim Google Chrome).
Ponieważ modyfikuje prototyp XMLHTTPRequest, zastanawiam się, jak niebezpieczne może to spowodować lub czy może spowodować poważne problemy z wydajnością. A tak przy okazji, czy byłaby jakaś ważna alternatywa?
Aktualizacja: jak przechwytywać żądania, zanim zostaną wysłane
Poprzednia sztuczka działa dobrze. Ale co, jeśli w tym samym scenariuszu chcesz wstrzyknąć niektóre nagłówki, zanim żądanie zostanie wysłane? Wykonaj następujące czynności:
(function(send) {
XMLHttpRequest.prototype.send = function(data) {
// in this case I'm injecting an access token (eg. accessToken) in the request headers before it gets sent
if(accessToken) this.setRequestHeader('x-access-token', accessToken);
send.call(this, data);
};
})(XMLHttpRequest.prototype.send);