Authorization of an api to get data in Angular js [duplicate]

Question

I have an API to get the data I have to put Authorization in header but it didn't work. Here is the image in postman

https://drive.google.com/open?id=18CY4uBc83u9AcN9Uu2SFXMjPgc4FPBzU

I have applied this question answer AngularJS Adding a header to the $http.get But it didn't work.

HTML:-

<button type="button" class="btn btn-primary btn-xs" ng-click="getApiData()">
  GET DATA
</button>

JS:-

$scope.getApiData = function(){
    $http({
      method  : 'GET',
      url     : 'http://api.getlokalapp.com/posts/7678/?format=json',
      headers : {
        'Content-Type'  : 'application/json',
        'Authorization' : '5ae5f64653ce85803b44b7b6f4d216c2dae02251'
      }
    })
    .then(function(response){
      console.log(response);
    });
  }

I want the output is response as it is shown in postman request but I am unable to get it please help me to get the data from the API.

Error message which I am getting is-

Access to XMLHttpRequest at 'http://api.getlokalapp.com/posts/7678/?format=json' from origin 'http://localhost:9000' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource.

But I have integrated other APIs and there I didn't get any error.

This problem is from the API provider's side. You can't do anything except asking them to fix this and allow you to use their API, since it is blocked by CORS (Cross Origin) policy. — N3R4ZZuRR0
– N3R4ZZuRR0, Commented Sep 8, 2019 at 15:41
Thanks @VermaJr. for your feedback and my code is correct if you see the gdrive link and my code do you think is there any bug for Authorization of the value — Sandeep Mukherjee
– Sandeep Mukherjee, Commented Sep 8, 2019 at 15:44
Your code looks fine. This problem is definitely from their side. Is their API available for public use? — N3R4ZZuRR0
– N3R4ZZuRR0, Commented Sep 8, 2019 at 15:47
If it is not available for public use, then is a very normal error because the browser is blocking it as it usually allows a request in the same origin for security reasons. You just cannot access their API using JavaScript then. — N3R4ZZuRR0
– N3R4ZZuRR0, Commented Sep 8, 2019 at 15:53

N3R4ZZuRR0 · Accepted Answer · 2019-09-09 00:18:57Z

0

You can't fix this in your production code unless the API provider adds Access-Control-Allow-Origin header in their backend. In order to just check if your code is working and to see the results, in Windows, paste this command in Run (Windows + R) window.

chrome.exe --user-data-dir="C:/Chrome dev session" --disable-web-security

And for Mac,

$ open -a Google\ Chrome --args --disable-web-security --user-data-dir

This will open a new Chrome instance which will grant you access to this API, bypassing browser security.

edited Sep 9, 2019 at 0:18

answered Sep 8, 2019 at 16:54

N3R4ZZuRR0

2,4224 gold badges21 silver badges32 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Sandeep Mukherjee Over a year ago

can you tell me the command for mac

Sandeep Mukherjee Over a year ago

This command didn't bypass the browser security

Sandeep Mukherjee Over a year ago

finally CORS issue was resolved from the backed only

Collectives™ on Stack Overflow

Authorization of an api to get data in Angular js [duplicate]

1 Answer 1

3 Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Linked

Related