Tôi đang xây dựng một ứng dụng web với các thư viện JS khác nhau (AngularJS, OpenLayers, ...) và cần một cách để chặn tất cả các phản hồi AJAX để có thể, trong trường hợp phiên người dùng đã ghi đã hết hạn (phản hồi trở lại với 401 Unauthorizedtrạng thái), để chuyển hướng anh ta đến trang đăng nhập.
Tôi biết AngularJS cung cấp interceptorsđể quản lý các tình huống như vậy, nhưng không thể tìm ra cách để đạt được sự đưa vào các yêu cầu OpenLayers như vậy. Vì vậy, tôi đã chọn cách tiếp cận JS vani.
Ở đây tôi tìm thấy đoạn mã này ...
(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);
... mà tôi đã điều chỉnh và có vẻ như nó hoạt động như mong đợi (chỉ thử nghiệm nó trên Google Chrome cuối cùng).
Khi nó sửa đổi nguyên mẫu của XMLHTTPRequest, tôi tự hỏi điều này có thể gây nguy hiểm như thế nào hoặc liệu nó có thể tạo ra các vấn đề hiệu suất nghiêm trọng hay không. Và bằng cách này sẽ có bất kỳ thay thế hợp lệ?
Cập nhật: cách chặn các yêu cầu trước khi chúng được gửi đi
Thủ thuật trước hoạt động tốt. Nhưng điều gì sẽ xảy ra nếu trong cùng một kịch bản, bạn muốn chèn một số tiêu đề trước khi yêu cầu được gửi đi? Làm như sau:
(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);