localhost上的Angular2 CORS问题

时间:2018-03-05 10:56:19

标签: java angular cors

Failed to load URL: 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:4200' is therefore not allowed access.

是否可以在不更改服务器端代码(Java Spring Controller)的情况下从Angular2修复此问题?

我的代码

const headers = new Headers({'Content-Type': 'application/json',
    'Access-Control-Allow-Origin' : '*'
});
return this.http.get(url, {headers: headers})
  .toPromise()
  .then(response => response.json().data as Hero[])
  .catch(this.handleError);

1 个答案:

答案 0 :(得分:1)

您的后端似乎不接受跨域请求。

为了让它在Angular上运行,您必须使用代理,以便您的前端和后端使用相同的域(相同的主机名和相同的端口)

在开发模式下,您可以使用proxy.config.json文件设置代理。假设您的后端托管在your-domain.com:80上,并且您的后端请求以/backend开头,则此文件将包含类似

的内容
{
    "/backend/*":{
        "target": "your-domain.com",
        "secure": false,
        "logLevel": "debug"
    }
}

通过更改package.json

中的以下配置,使您的开发HTTP服务器使用此文件
 "scripts": {
    "start": "ng serve --proxy-config proxy.config.json",
  }

请勿忘记使用http://localhost:4200/backend/...而非http://your-domain.com/...

等请求致电您的后端

为了使其在远程服务器上运行,您必须在Java Web应用程序(例如nginx或Apache)上设置HTTP服务器,配置为执行与之前相同的操作。