Question

我只是通过创建一个小项目来学习Anuglar 2。此项目依赖于不允许CORS的外部API。因为我只需要在API上发出GET请求，所以我很乐意制作简单类型的GET来避免CORS限制。

当我执行我的代码时，我在我的Firefox开发人员工具网络监控中看到，呼叫是作为GET进行的（不是＆＃34;选项＆＃34;如果我真的被CORS阻止的话会是这种情况）我可以看到HTTP状态为200的有效响应。

问题是我的角度代码仍然失败了＆＃34;标准＆＃34; CORS错误并转储对象。

我试图通过倾倒的物体阅读，以期更好地理解错误，但到目前为止还没有运气。

我确实尝试使用谷歌搜索，但大多数情况不满意绕过CORS的简单请求，所以我无法自己找到一些帮助。

这似乎不是Firefox的问题，因为我可以看到成功的GET请求，所以我认为它是一个Angular 2问题。你能帮我解决这个问题吗？

以下是我的代码示例，其中包含外部API的URL：

  testingObervable(): void {
    this._http
      .get(`http://oda.ft.dk/api/Sag?$inlinecount=allpages&$filter=typeid%20eq%203`,
      { headers: this.getHeaders() })
      .subscribe(data => {
        console.log(data);
      });
  }

  private getHeaders() {
    let headers = new Headers();
    headers.append('Accept', '*/*');
    return headers;
  }

这是＆＃34;标准＆＃34;我在Firefox中遇到的CORS错误：

阻止跨源请求：同源策略禁止在http://oda.ft.dk/api/Sag读取远程资源？$ inlinecount = allpages＆amp; $ filter = typeid％20eq％203。（原因：缺少CORS标题'Access-Control-Allow-Origin'。

以下是外部API的响应标头：

HTTP / 1.1 200好的缓存控制：无缓存 Pragma：没有缓存 Content-Type：application / json;字符集= utf-8的到期：-1 服务器：Microsoft-IIS / 8.5 DataServiceVersion：3.0 X-AspNet-Version：4.0.30319 X-Powered-By：ASP.NET 日期：星期一，2018年1月1日17:13:14 GMT 内容长度：34771

这是CORS错误后转储对象的折叠版本，我不知道它是否相关，但它肯定不会给我提供信息。

ERROR Object {_body：error，status：0，ok：false，statusText：＆＃34;＆＃34;，headers：{...}，type：3，url：null} core.js：1427

关于CORS的一些资源：https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS

Answer 1

这不是您的代码或Angular的问题。这是CORS应该如何运作的。

因为我只需要在API上发出GET请求，所以我很乐意制作简单类型的GET来避免CORS限制。

这个简单的要求＆＃39; type不会避免CORS限制，但这些请求不需要发送预检。响应应该仍然包含浏览器允许的请求的CORS头。

您链接到的CORS上的资源在功能概述部分指出（强调我的）：

跨源资源共享标准的工作原理是添加新的HTTP标头，允许服务器描述允许使用Web浏览器读取该信息的起源集。另外，对于可能对服务器数据（......）造成副作用的HTTP请求方法，规范要求浏览器＆＃34;预检＆＃34;请求（...）

简而言之，虽然CORS适用于所有跨域HTTP请求，但只会针对某些类型的HTTP请求发送预检。

Angular 2：简单获取对CORS阻止的外部API的请求，但在网络监视中得到200

1 个答案: