Question

我使用Angular2应用程序点击了休息服务。

这样做时，我收到一条消息说明：

Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:3000' is therefore not allowed access.

我在这里阅读了几篇文章，并得出结论，为了摆脱这个问题，我需要从服务器响应中指定标题。这正是我所做的。

如果我向同一个网址发出邮递员请求，我可以看到返回的标头：

Access-Control-Allow-Headers →Content-Type
Access-Control-Allow-Method →GET, POST
Access-Control-Allow-Origin →*

我是否需要附加任何其他标头才能使其正常工作？

Answer 1

REST请求有时需要对选定资源进行预检OPTIONS请求。你可以在这里阅读更多相关信息：

https://developer.mozilla.org/en-S/docs/Web/HTTP/Access_control_CORS#Preflighted_requests

我总是手动完成此操作，但是如果您使用的是RestEasy（随JBoss一起提供），那么从版本3.09开始，就会有一个帮助版本。这篇文章解释了简单的用法。

Problems Resteasy 3.09 CorsFilter

如果可能，我仍然建议您不要使用CORS，而是使用反向代理。

Answer 2

有两种方法可以轻松解决这个问题，您可以在浏览器中安装扩展程序，以便进行跨源请求。或者您创建proxy.conf.json文件：

{
  "/proxy": {
    "target": "http://route to your rest service",
    "secure": false
  }
}

然后转到package.json文件并更改启动配置：

"scripts": {
    "start": "ng serve --proxy-config proxy.conf.json",

对我来说，这是有效的，请检查您的REST API是否可以使用我放置的名称

"/proxy"

更改您的服务/组件，该服务/组件创建请求的url与您在proxy.conf.json中的名称匹配的请求

示例REST调用：

private _restUrl = '/proxy/';    

public testRestConnection = (): Observable <string> => {
let restUrl = this._restUrl + 'path you need';
return this._http.get(restUrl)
  .map((response: Response) => <string>response.text())
  .catch(this.handleError);

}

Answer 3

@angryip，你在使用什么浏览器。这听起来是CORS问题。我在.net环境中的一个Web API项目中遇到此问题，要解决此问题，我必须安装icrosoft.AspNet.WebApi.Cors。我不确定你正在处理什么样的开发环境。以下是我发现对启用CORS有用的链接：https://www.asp.net/web-api/overview/security/enabling-cross-origin-requests-in-web-api

No＆＃39; Access-Control-Allow-Origin＆＃39;标题Angular2

3 个答案: