在任何低于 10 的 IE 版本上，使用 AngularJS 拒绝 XMLHttpRequest 访问答案

【问题标题】：XMLHttpRequest Access Denied with AngularJS on any IE version below 10在任何低于 10 的 IE 版本上，使用 AngularJS 拒绝 XMLHttpRequest 访问
【发布时间】：2013-09-13 09:54:29
【问题描述】：

在任何版本早于 10 的 Microsoft IE 浏览器上查看我的应用程序时，我在控制台上收到以下奇怪的错误：

我尝试通过在 AngularJS 库之前添加以下 JavaScript 代码来取消控制台：

console.log = function(){};
window.console = {log: function(){}};

这并没有什么不同。 IE 10 中同样的错误显示为：

SCRIPT7002: XMLHttpRequest: Network Error 0x80070005, Access is denied.

可能我试图从 API 中获取“/me”，以检查用户是经过身份验证还是访客。

基本上。每次服务器给出 2XX 或 3XX 以外的响应时，消除那些烦人的控制台错误会很棒！

更新：这似乎与通过不同的子域 (CORS) 访问 API 有关；

【问题讨论】：

您不会碰巧为 AJAX 请求设置 mime 类型或内容类型吗？
可能与github.com/xdissent/iectrl/issues/2 相关您是否在进行任何ajax 调用？跨域的？似乎是一个安全问题！
是的，我使用了很多 ajax，因为我在 REST api 前面工作。是的，API 位于另一个子域中，所以我使用的是 cors。 AngularJS CORS 实现和 IE lt 10 应该有问题吗？
calebwoods.com/2014/05/10/angularjs-ie9-cors-nginx

标签： internet-explorer angularjs cors

【解决方案1】：

通过 Google AngularJS 小组中一位经验丰富的 ng-dev 的指导，我能够实现的解决方案是 xDomain library。

设置非常简单，只需在 API 的根目录下放置一个 proxy.html 文件，使用正则表达式/字符串作为允许的来源（'master'），并在前端引用脚本，然后从你的前端脚本（'master'）指向这个文件。

它的工作原理是在 iframe 中打开 proxy.html 文件，并使用 postMessage 与 CORS 资源通信。

与 $http 和 $resource 一起工作就像一个魅力。

您还可以通过将脚本放在所有 JavaScript 库包括的上方来维持普通浏览器的正常运行：

<!--[if lte IE 9]>
<script src="xdomain.js" slave="http://example.org/proxy.html"></script>
<![endif]-->

【讨论】：

这对我来说非常有效，我只花了 5 分钟就完成了！
不幸的是（在本文发布时）xDomain 不适用于任何形式的 FormData / File 上传。问题：github.com/jpillora/xdomain/issues/36
好吧，要在旧版浏览器上支持类似 XHR 的文件上传，你应该使用 iFrame 后备我的朋友（别无他法）。是的 - xDomain 旁边的另一个
Xdomain 现在提供“与 FormData 的无缝集成”，据 github.com/jpillora/xdomain
大家好，我想我应该澄清一下，XDomain 确实支持跨域发送 FormData 对象。但是，您的浏览器必须首先支持 FormData - 所以这排除了 IE8 和 9。caniuse.com/#formdata

【解决方案2】：

当然，您的问题与 CORS 相关。 IE10 使用了真正的 XmlHttpRequest，但在此之前，IE 没有。到目前为止，我发现解决这些类型问题的最简单方法是使用 apache 或 nginx 代理 API。例如，使用 nginx，在您的服务器中 {} 块：

location /api {
   proxy_pass http://my.server.name:12345/v1;
   proxy_redirect off;
}

请注意，即使 jQuery 也不完全支持 XDomainRequest 和 CORS，您必须添加插件才能获得 XDR。另请注意，XDR 对 CORS 有一些严重的限制。

【讨论】：

我们确实在 nginx 中使用 proxy_pass 将 API 请求传递给 gunicorn，但似乎并没有解决问题。是否需要其他配置？
哦，现在我明白了……一个proxy_pass，让它在同一个域上。需要考虑这是否会导致任何并发症。

【解决方案3】：

在我的情况下，Response Headers 包含

Content-Type:application/json; charset=UTF-8

这是 IE9 的问题，因为它无法正确处理/解析响应中的 JSON 对象。

将Response Headers 切换为

Content-Type:text/plain; charset=UTF-8

此外，请确保为 IE9 包含以下模块：https://stackoverflow.com/a/28905072/1202371

允许以文本形式接收响应，然后将其转换为 JSON 对象。

【讨论】：