Question

我想拦截针对Google Maps API的XHR请求，以便我可以通过自己的代理服务器运行它们，以将API密钥设为私有。

Angular拥有自己的HttpInterceptor，但是它们只会拦截使用Angular的HttpClient发出的XHR请求，而不是Maps API在Angular框架之外发出的任何请求。我认为，猴子补丁XMLHttpRequest.open()是到达Maps API的请求的最佳方法，我已经这样做了：

  var oldXHROpen = XMLHttpRequest.prototype.open;

  XMLHttpRequest.prototype.open = function(method, url, async, username, password) {
    console.log(url);
    return oldXHROpen.apply(this, arguments);
  };

上面的代码放在我的<script>的{{1}}的{{1}}部分的<head>中，因此在执行任何Angular代码之前，肯定要先执行它。

该修补程序在短时间内起作用。我看到注销了我的代码加载的一些资产的URL，但是随后出现此消息：

index.html

之后，仅记录了一个URL，这是我进行的最后一次拦截。 XHR请求继续被处理，但是我的补丁从未看到它们发生。

我确定这与zone.js有关，但是我仍然不知道它是如何发生的。由于我在Angular或zone.js之前甚至重新定义了Angular is running in the development mode. Call enableProdMode() to enable the production mode.，因此甚至有机会看到原来的XMLHttpRequest.prototype.open函数，该函数隐藏在open()变量中，因此如何直接连接到本机oldXHROpen能够绕过我的补丁再次发生吗？

Answer 1

看来我在错误的前提下工作，即Google Maps API的客户端必须提出XHR请求才能完成工作。

不是。通过加载图像，CSS和字体并添加一些JSONP即可完成所有操作。

我的猴子修补程序确实有效，并且没有被Angular撤消。

我如何绕过Angular并用自己的猴子修补程序来撤消猴子修补程序？

1 个答案: