Я будую веб-додаток з різними бібліотеками JS (AngularJS, OpenLayers, ...) і мені потрібен спосіб перехопити всі відповіді AJAX, щоб мати можливість, у випадку, якщо сеанс користувача, що зареєструвався, закінчився (відповідь повертається зі 401 Unauthorizedстатусом), щоб перенаправити його на сторінку входу.
Я знаю, що AngularJS пропонує interceptorsкерувати подібними сценаріями, але не зміг знайти спосіб досягти такої інжекції у запитах OpenLayers. Тому я обрав підхід для ванільного JS.
Тут я знайшов цей фрагмент коду ...
(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);
... що я адаптував і схоже, що він поводиться так, як очікувалося (протестував лише на останньому Google Chrome).
Оскільки він модифікує прототип XMLHTTPRequest, мені цікаво, наскільки це може призвести до небезпеки або якщо це може спричинити серйозні проблеми з продуктивністю. І до речі, чи була б якась вагома альтернатива?
Оновлення: як перехопити запити, перш ніж їх надсилати
Попередній трюк працює добре. Але що робити, якщо за тим же сценарієм ви хочете вставити деякі заголовки до надсилання запиту? Зробіть наступне:
(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);