Angularjs set a authorization header

Question

I am trying to put an authorization header in my requests but it doesn't work.

I am using this:

var config = {headers: {
  'Authorization': token
  }
};
return $http.get('http://localhost:3000/apis/users/all', config);

And also I tried this:

$http.defaults.headers.common['Authorization'] = token;

But with both cases I got this headers in the back-end request:

Accept:*/*
Accept-Encoding:gzip, deflate, sdch
Accept-Language:es-ES,es;q=0.8,ca;q=0.6,en;q=0.4,gl;q=0.2
Access-Control-Request-Headers:accept, authorization
Access-Control-Request-Method:GET
Connection:keep-alive
Host:localhost:3000
Origin:http://localhost:8000
Referer:http://localhost:8000/
User-Agent:Mozilla/5.0 (Macintosh; Intel Mac OS X 10_10_4)         AppleWebKit/537.36 (KHTML, like Gecko) Chrome/45.0.2454.85 Safari/537.36

I need something like this:

Authorization: token

But I got this:

Access-Control-Request-Headers:accept, authorization

Then, I don't have in any place the token value.

I am using expressjs for the back-end and I using this for CORS:

app.use(function(req, res, next) {
    res.header('Access-Control-Allow-Origin', '*');
    res.header('Access-Control-Allow-Headers', 'Origin, X-Requested-With, Content-Type, Accept, Authorization');
    next();
  });

Also say that testing with the chrome extension Advance Rest Client it is working fine. In the request header there is a Authorization: valueOfToken..

Thanks a lot.

Did u ever get an answer to this ? – Pinch Dec 25 '15 at 14:51 — Pinch, Dec 25 '15 at 14:51

score 22 · Answer 1 · answered Sep 06 '15 at 15:29

22

Authorization can't be plain.

specify weather its a Basic or Bearer Authorization

Something like

$http.defaults.headers.common['Authorization'] = 'Basic ' + token;

or

$http.defaults.headers.common['Authorization'] = 'Bearer ' + token;

answered Sep 06 '15 at 15:29

maddygoround

2,145
2
20
32

Fwiw, `'Bearer'` didn't work for me in my server setup. I had [to use `'Token'`](https://stackoverflow.com/a/36909297/1028230) before the token's value. But the gist of the answer was right on. – ruffin Jun 14 '21 at 12:54

score 6 · Answer 2 · edited Dec 23 '17 at 23:13

6

I was having this same issue and it turned out the issue had to do with Apache configuration on the server side. One thing I did find that might be useful to you here is that my Authorization token is sent in the preflight request headers rather than the main request, so it might not appear to be in the headers of the request when you look at it in the developer tools.

I'm setting my defaults like this:

app.config(function($httpProvider) {
    $httpProvider.defaults.common['Authorization'] = token;
    // For angular 1.5, use:  
    // $httpProvider.defaults.headers.common['Authorization'] = token;        
});

edited Dec 23 '17 at 23:13

Gonen

4,005
1
31
39

answered Mar 08 '16 at 22:47

kfhohn

135
1
3
7

You should use the $httpProvider provider in a config block not the $http instance. – david.carm Feb 28 '17 at 12:52
1

On angular 1.5 you should use `$httpProvider.defaults.headers.common.Authorization` – Daniele Sep 20 '17 at 14:21

Sandeep · Answer 3 · 2016-10-19T04:51:49.690

3

Try this:

$http({

url : "127.0.0.1/login",
method : 'GET',
headers : {
      Content-Type : 'application/json',    
      Authorization: token
      }
}).success(function(data){
    alert("login Successfully");
}).error(function(error){
    alert("login error");
})

edited Oct 19 '16 at 04:51

answered Sep 06 '15 at 16:21

Sandeep

1,461
13
26

1

the key should be **headers** here, not header – hasan.hameed Oct 17 '16 at 10:47

Angularjs set a authorization header

3 Answers3

Linked

Related