CODEWITHSUNDEEP
javascriptangularredmine-api
Stefan
Stefan

Reputation: 1511

Angular 2 access redmine Rest Api, no 'Access-Control-Allow-Origin'

I try to get issues from redmine via them Rest Api. When I call it from Postman I get response, but when I do it from my angular App I get such error

OPTIONS https://redmine.ourDomain.net/issues.json 404 (Not Found) XMLHttpRequest cannot load https://redmine.ourDomain.net/issues.json. 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. The response had HTTP status code 404.

Its how I do it in 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;
            }
        });
}

And there how request looks in my browser enter image description here

Upvotes: 0

Views: 1865

Answers (2)

Fernando Buccella
Fernando Buccella

Reputation: 69

CORS must be set up in the backend. Please note that is NOT a good practice to allow all origins Access-Control-Allow-Origin: '*' and that you will need to specify the other headers as well:

Access-Control-Allow-Methods: GET, OPTIONS Access-Control-Allow-Headers: authorization.

Upvotes: 1

joh04667
joh04667

Reputation: 7437

You'll need to enable CORS access on the backend: http://www.redmine.org/plugins/redmine_cors

Here's a nice extension that will let you test frontend code outside of normal CORS restrictions. It's strictly for testing and won't help a production app, but nice to have: https://chrome.google.com/webstore/detail/allow-control-allow-origi/nlfbmbojpeacfghkpbjhddihlkkiljbi

Upvotes: 1

Related Questions