如何解除Javascript对象中的方法？特别是XMLHttpRequest.open

Question

我们有一个React应用，有人把XMLHttpRequest.open方法修补成这样。

const token = ....
let xhrPrevOpen = XMLHttpRequest.prototype.open;
XMLHttpRequest.prototype.open = function (...a) {
    xhrPrevOpen.apply(this, [ ...a ]);
    this.setRequestHeader('Authorization', `Bearer ${token}`);
};

很明显，这样做是为了在整个应用程序的所有http请求中默认包含授权头，每次有人需要提出请求时，都能节省一行额外的代码。

这个东西的一个缺点是，我们有一些用例，我们要向外部apis（跨域）发出请求，这些apis需要自己的授权头。默认情况下再添加一个授权头是没有用的，因为它是附加头而不是替换头。

补丁是在index.js文件中完成的，它是加载整个react UI的主文件。

有没有办法能够仍然调用未打补丁的方法，或者以某种方式能够替换XMLHttpRequest中的授权头。

显然，XMLHttpRequest似乎没有办法取消设置或替换头。它只有一个方法，叫做 setRequestHeaders 来追加它们。

我想了几个不同的方向来解决这个问题。任何关于他们的建议或替代方案都会有帮助。

1 - 试着把已经打过补丁的（patch1）方法与原始参考（original）打上补丁（patch2），使用后再打回补丁1方法。不知道是否可以从 patch1 方法中获得原始参考。

2 - 将index.js中的原始引用保存到某个全局上下文中，在进行外部调用的同时，将XMLHttpRequest.prototype.open瞬间改为orginal，然后重新设置回来。

3 - 找到一种方法来取消设置和或替换头。

4-任何其他不使用XMLHttpRequest下面的HTTP请求库。我不确定是否存在。我想所有的库如fetch，axios，jquery ajax一定是使用XMLHttpRequest下面的。

Answer 1

这种情况有点不幸，而且 理想的解决办法是先不打补丁的方法而不是更新需要添加该头的各种调用，让它们这样做（可能是通过调用一个包装函数）。

如果你不能做到这一点。

我就会试着去编辑 index.js 像这样。

const token = ....
let xhrPrevOpen = XMLHttpRequest.prototype.open;
XMLHttpRequest.prototype.open = function (...a) {
    xhrPrevOpen.apply(this, [ ...a ]);
    this.setRequestHeader('Authorization', `Bearer ${token}`);
};
XMLHttpRequest.prototype.__rawopen__ = xhrPrevOpen; // <====

...然后用 __rawopen__ 而不是 open 的情况下，如果你不想要打补丁的 open.

再来: 只有当你真的，真的不能撤消那块可怕的补丁时 open.

---

• 任何其他不使用XMLHttpRequest下面的HTTP请求库。我不确定是否存在。我想所有的库，比如fetch，axios，jquery ajax一定是在下面使用XMLHttpRequest的。

我不会认为在这样的情况下 fetch，只要是浏览器提供的原生版本。我希望这两个 XMLHttpRequest 和 fetch 使用相同的底层内部特征，而不是使用 fetch 字面 使用暴露的 XMLHttpRequest 的代码。你可能需要检查一下你的目标浏览器是否有 fetch 真正受到您的代码对 XMLHttpRequest.prototype.open. 我怀疑它不是，这将给你另一种方法来解决这个问题。