how to add access token in angularjs http

Question

i am new in developing a website using angularJS as my client-side and i am trying to access my JSON thru API call with $http.get method for angular.

my issue is that my API call requires an Access Token. i always get this error whenever i try to refresh my page.

XMLHttpRequest cannot load http://unexus-api-dev-3urcgetdum.elasticbeanstalk.com/drugstores. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:8888' is therefore not allowed access.

i am currently using this code to fetch my data.

myApp.controller('loginCtrl', function($scope, $http) {
  $http.get("http://unexus-api-dev-3urcgetdum.elasticbeanstalk.com/drugstores")
    .then(function(response) {
      $scope.names = response.data.records;
    });
});

how do i insert an access token on the $http.get method.

score 5 · Answer 1 · answered Dec 21 '15 at 08:47

It depends on how your API get this access token. The most popular option is to just add specyfic header to your request

var req = {
   method: 'POST',
   url: 'http://example.com',
   headers: {
      'Authorization': 'access token'
   },
}

$http(req).then(function(){...}, function(){...});

you can also add it globally

module.run(function($http) {
  $http.defaults.headers.common.Authorization = 'Basic YmVlcDpib29w';
});

or by using Angular interceptors http://www.diwebsity.com/2015/12/17/interceptor-in-angular/

i still get the same error even if i did all you said. – George Terence Ting Dec 21 '15 at 10:20 — George Terence Ting, Dec 21 '15 at 10:20

score 1 · Accepted Answer · edited May 23 '17 at 12:01

1

You are running into a SOP issue that is described here https://en.wikipedia.org/wiki/Same-origin_policy

You should have a look here:

edited May 23 '17 at 12:01

Community

1
1

answered Dec 21 '15 at 08:51

Hitmands

13,491
4
34
69

how to add access token in angularjs http

2 Answers2