Angular2中的CORS问题[重复]答案

【问题标题】：CORS ISSUE in Angular2 [duplicate]Angular2中的CORS问题[重复]
【发布时间】：2016-09-20 05:47:40
【问题描述】：

我正在为我的应用程序使用 webpack angular2 starter kit (https://github.com/AngularClass/angular2-webpack-starter)，现在我遇到了问题。

我尝试拨打电话

getSomeData(): Observable<any> {
  let url =  here is my api URL;
  let headers = new Headers({ 'Content-Type': 'application/json; charset=utf-8', "Access-Control-Allow-Origin": "*", 'dataType': 'json', });
  let options = new RequestOptions({ headers: headers });

  return this._http.get(url, options).map(res => res.json());
}

我还有下一个错误

XMLHttpRequest 无法加载（我的 URL）对预检请求的响应未通过访问控制检查：请求的资源上不存在“Access-Control-Allow-Origin”标头。因此，Origin 'http://localhost:3000' 不允许访问。响应的 HTTP 状态代码为 405。

这个Api（它使用firebird）默认返回XML，这可能会导致问题。

如何让 JSON 总是出现？
如何使用 CORS 解决此问题？

【问题讨论】：

您的后端如何提供数据？有快递吗？
如果是 Express，你可以使用这个包并按照说明操作：npmjs.com/package/cors

标签： javascript angular cors rxjs http-status-code-405

【解决方案1】：

此问题在服务器端。后者必须在 HTTP 调用的响应中返回 Access-Control-Allow-Origin 标头。

大多数时候，您可以将一些工具插入您的服务器应用程序来为您执行此操作。服务端知道客户端发送Origin头（由浏览器自动添加）时必须返回CORS头。

有关 CORS 的更多详细信息，请参阅本文：

http://restlet.com/blog/2015/12/15/understanding-and-using-cors/

【讨论】：