我正在构建一个使用不同JS库(AngularJS、OpenLayers等)的web应用程序。并且需要一种截获所有AJAX响应的方法,以便能够在记录的用户会话过期的情况下(响应返回401 Unauthorized
状态)将他重定向到登录页面。
我知道AngularJS提供了interceptors
来管理这样的场景,但没有找到一种方法来实现对OpenLayers请求的注入。所以我选择了一种普通的JS方法。
Here我找到这段代码..。
(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);
我对...which进行了调整,看起来运行正常(只在上一次谷歌浏览器上测试了它)。
当它修改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);
发布于 2021-03-10 20:09:01
尝尝这个
let oldXHROpen = window.XMLHttpRequest.prototype.open;
window.XMLHttpRequest.prototype.open = function(method, url, async, user, password) {
console.log({method});
// Show loader
this.addEventListener('load', function() {
console.log('load: ' + this.responseText);
// Hide loader
});
return oldXHROpen.apply(this, arguments);
}
https://stackoverflow.com/questions/25335648
复制相似问题