Angular 2访问redmine Rest Api，没有'Access-Control-Allow-Origin'

Question

我试图从redmine通过他们Rest Api获得问题。当我从Postman调用它时，我得到了响应，但是当我从我的角度应用程序中执行此操作时，我得到了这样的错误

  

选项https://redmine.ourDomain.net/issues.json 404（未找到）   XMLHttpRequest无法加载https://redmine.ourDomain.net/issues.json。对预检请求的响应未通过访问控制检查：请求的资源上不存在“Access-Control-Allow-Origin”标头。因此，不允许原点“http://localhost:3000”访问。响应的HTTP状态代码为404.

我在Angular中如何做到这一点

login(user: User): Observable<boolean> {
    var headers: Headers = new Headers();
    headers.append("Authorization", "Basic " + btoa(user.login + ":" + user.password));
    let options = new RequestOptions({ headers: headers });
    return this.http.get("https://redmine.ourDomain.net/issues.json", options)
        .map((response: Response) => {
            debugger;
            if (response.status == 200) {
                // set token property

                // store username and jwt token in local storage to keep user logged in between page refreshes
                localStorage.setItem('currentUser', JSON.stringify({ user }));

                // return true to indicate successful login
                return true;
            } else {
                // return false to indicate failed login
                return false;
            }
        });
}

请问我的浏览器中的请求如何

Answer 1

您需要在后端启用CORS访问：http://www.redmine.org/plugins/redmine_cors

这是一个很好的扩展，可以让你测试正常CORS限制之外的前端代码。它严格用于测试，对生产应用程序没有帮助，但很高兴：https://chrome.google.com/webstore/detail/allow-control-allow-origi/nlfbmbojpeacfghkpbjhddihlkkiljbi

Answer 2

必须在后端设置CORS。请注意，允许所有来源Access-Control-Allow-Origin不是一个好习惯：＆＃39; *＆＃39;并且您还需要指定其他标题：

访问控制 - 允许 - 方法：获取，选项 Access-Control-Allow-Headers：授权。