current community

your communities

more stack exchange communities

Stack Exchange
tour help
stack overflow careers
Take the 2-minute tour ×
Stack Overflow is a question and answer site for professional and enthusiast programmers. It's 100% free, no registration required.
up vote 0 down vote favorite

New to Angular but I am learning. What my goal is: I have a login view that passes a user object to our API, API checks it against user database and reposnds with Base64 conversion of username and password. I have Also setup a page that returns some simple JSON if the user passes Authorization : Base ... as a header they will receive the data. If not it responds 401 and I set up a global 401 handler to route back to "/login".

My issue is that in my LoginService I receive the Base64 key and I can alert it out to show that I received it. But I get an "undefined" if I inject this service into my json page as a header like so..

$http.get('http://myURL/api/project', { headers: {"Authorization": "Basic " +    userLoginService.myData}})

So the basic thing I am trying to do is pass data from one SERVICE to another SERVICE, I have seen how to do this from one CONTROLLER to another but, I am not sure what to do here. Any sample code would obviously be great. Thanks a lot in advance.

share|improve this question

2 Answers 2

up vote 0 down vote

I'm not sure you can share data from one service to another service without passing the data as a parameter to a method or constructor. e.g.

//inside of a service
this.makeAPIcall = function(token){
    $http.get('http://...', {headers: {'Authorization': 'Basic ' + token}});
}

But you likely want to store the authentication key for future http requests anyway and it would be best to store this key in a way that wouldn't require you to ask for authentication each time you need to make a request. I suggest you store your token in the browser's localstorage or as a cookie so that you can retrieve the token through the term for which the user is logged in.

As a side note, if you find that you're going to have to pass the Authorization header each time you make an API call, you may want to configuring your $httpProvider on the module itself (this example assumes that you are using LocalStorange and that you have an authKey stored in you LocalStorage:

angular.module('myApp', []).run(function($http, LocalStorageFactory){
    $http.defaults.headers.common['Authorization'] = 'Basic ' + LocalStorageFactory.get('authKey');
});
share|improve this answer
    
In the latter code you posted i notice two big things. 1: You are setting headers in the myApp.RUN method, I thought this was supposed to be done in side of config. 2: You are setting headers with $http.defaults... I thought it was supposed to be done using $httpProvider –  Shane Jul 19 '13 at 13:34
    
I will play around a bit with storing the token and setting the header in a run method on the app. I will let you know my results as soon as I have some :) –  Shane Jul 19 '13 at 13:35
    
would you mind showing how to save the data response from a srvice to localStorage? –  Shane Jul 19 '13 at 14:18
    
It can be done in config or in run. I showed it in run so Angular can set up the app's modules and you'd have access to the LocalStorageFactory*. If you're not wrapping localStorage in a factory then you could use config and $httpProvider and insert the auth tokens stored in localStorage. * Using LocalStorageFactory is optional; I'd wrap its API in a factory to use cookies as a backup. If you're not interested in that then use localStorage from the config and you shouldn't have a problem. ** You can read about the LocalStorage API at w3s –  mmbb Jul 19 '13 at 18:04
    
So, what I have done so far. –  Shane Jul 22 '13 at 16:35
up vote 0 down vote

So, what I have done so far: when I get a response from my API I set it as a cookie. In my service that I use to GET some JSON I set the cookie in the header like so 

var token = "";
token = $cookieStore.get('token');
 $http({method: "GET", url:"http://example.com/api/project", headers:{'Authorization' : 'Basic ' + token}})

However, when I set headers this way, my app doesn't even run the GET. Instead in firebug Console I see

Object { transformRequest=[1], transformResponse=[1], method="GET", more...}

When I click this I can see that there headers are being set, but the app doesn't perform the GET operation, so close yet so far away. Any ideas?

share|improve this answer

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.