我想拦截对 Google map API 的 XHR 请求，这样我就可以通过我自己的代理服务器运行它们，以此来保护我的 API key 的私密性。
Angular 有自己的 HttpInterceptor s，但它们只会拦截使用 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>中在<head>我的部分 index.html ，因此它肯定会在执行任何 Angular 代码之前执行。
补丁有效... 时间很短。我看到我的代码加载的一些 Assets 的 URL 已注销，但随后出现此消息:
Angular is running in the development mode. Call enableProdMode() to enable the production mode.
在那之后，只记录了一个 URL，这是我进行的最后一次拦截。 XHR 请求继续得到处理，但我的补丁从未看到它们发生。
我确定这与 zone.js 有关，但我仍然不明白它是如何发生的。因为我重新定义了 XMLHttpRequest.prototype.open在 Angular 或 zone.js 甚至有机会看到原始 open() 之前函数，隐藏在 oldXHROpen 中变量，如何直接连接到 native open()曾经设法再次发生，绕过我的补丁？
最佳答案
看来我是在错误的前提下工作，即 Google Maps API 的客户端必须发出 XHR 请求才能完成其工作。
事实并非如此。这一切都是通过加载图像、CSS 和字体并加入一点 JSONP 来完成的。
我的猴子补丁确实有效，而且不会被 Angular 撤消。
关于javascript - 我如何绕过 Angular 用它自己的猴子补丁来撤消我的猴子补丁？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/56578423/