-1

I am making a http POST request from an angular 8 app (which is running on localhost) to an auth API endpoint to which I have no access. I need to get a token from this endpoint to validate the user. The request is shown below

login(username: string, password: string) {
    const httpOptions = {
        headers: new HttpHeaders({
            'Content-Type': 'application/x-www-form-urlencoded'
        })
    };

    const body = new HttpParams()
        .set('grant_type', 'password')
        .set('username', username)
        .set('password', password);

    return this.http.post<any>(`https://api-url`, body, httpOptions)
        .pipe(map(user => {
            // login successful if there's a jwt token in the response
            if (user && user.access_token) {
                // Work with user details
            }

            return user;
        }));
}

I get an error 

Access to XMLHttpRequest at 'https://api-url' from origin 'http://localhost:4200' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

When I make the same request from Postman, it works perfectly and I get the response from that endpoint with a token. I don't exactly know what is causing the issue. My screenshots from postman request are shown below. Please help me out with this.

enter image description here

enter image description here

suvenk
  • 467
  • 1
  • 5
  • 24
  • Are you using identity server 4? – Binara Thambugala Jan 11 '20 at 06:25
  • I don't know what is being used on the API side. It is an external one given to me and I only have control on the client side. – suvenk Jan 11 '20 at 06:29
  • What is the Authorization type? Basic? – Binara Thambugala Jan 11 '20 at 06:41
  • The Authorization type I am using in postman is 'Inherit auth from parent'. Do I need to setup anything related to Authorization when I am making the request from the app? The endpoint was given to me and was mentioned that it is a public endpoint and a POST request has to be made as mentioned above to get the token. – suvenk Jan 11 '20 at 06:57
  • Are you using a postman collection? Can you show me you Post man screen? – Binara Thambugala Jan 11 '20 at 07:01
  • Since this is a resource owner password mechanism there must be a Client ID and a Client secret. Ask anyone who knows about the API. – Binara Thambugala Jan 11 '20 at 07:09
  • I added screenshots from my postman screens. I am not using postman collection. I did not send any Client ID or Client secret in the postman request – suvenk Jan 11 '20 at 07:26
  • Any luck? Did you ask from any one who knows about API? – Binara Thambugala Jan 11 '20 at 08:00
  • The ones who gave me the API link are not available at the moment. I am sorry to ask but are you sure there is no fix for this from client side? – suvenk Jan 11 '20 at 08:03
  • Let us [continue this discussion in chat](https://chat.stackoverflow.com/rooms/205785/discussion-between-binara-thambugala-and-suvenk). – Binara Thambugala Jan 11 '20 at 08:06

1 Answers1

-1

you should try using an interceptor Refer this

if it doesn't work and you're using chrome as your browser then try this in Run. maybe your back-end hasn't changed CROS properties to receive data from all origins.

`chrome.exe --user-data-dir="C:/Chrome dev session" --disable-web-security`
Ravindu
  • 24
  • 4