How to get the authenticated user info and use in all controllers and services?

Question

I'm using angularFireAuth and I want to retrieve the logged in user's info and use in all the controllers or services when the app is initial.

Currently, I used this in every controller but i having some problem.

$scope.$on("angularFireAuth:login", function(evt, user){ 
  console.log(user);
});

The callback will not call if it is not a full page load or return null when app initial.

I need some tips for how can I return the authenticated user's info so I can use when app is initial and in all the controllers and services.

Example

When in controller or services

• $scope.auth.user.id will return user's ID
• $scope.auth.user.name will return user's name
• etc

Solution 1

I would start with a userService for this:

angular.module('EventBaseApp').service('userService', function userService() {
    return {
        isLogged: false,
        username: null
    }

});

And write a LoginCtrl controller:

angular.module('EventBaseApp')
  .controller('LoginCtrl', function ($scope, userService, angularFireAuth) {
    var url = "https://example.firebaseio.com";
    angularFireAuth.initialize(url, {scope: $scope, name: "user"});

    $scope.login = function() {
        angularFireAuth.login("github");

    };
    $scope.logout = function() {
        angularFireAuth.logout();
    };

    $scope.$on("angularFireAuth:login", function(evt, user) {
      userService.username = $scope.user;
      userService.isLogged = true;
    });

    $scope.$on("angularFireAuth:logout", function(evt) {
      userService.isLogged = false;
      userService.username = null;
    });
});

Inject the userService anywhere you want the user.

My app that am currently working on that uses this - https://github.com/manojlds/EventBase/blob/master/app/scripts/controllers/login.js

Based on ideas presented here - http://blog.brunoscopelliti.com/deal-with-users-authentication-in-an-angularjs-web-app

Solution 2

i'm not sure quite what your question is. but if you are looking to authorise once rather than in each controller, you can put the code into the module instead and put it into the $rootScope.

var myapp = angular.module('myapp').run(
    function ($rootScope) {
        $rootScope.user = null;

        $rootScope.$on("angularFireAuth:login", function (evt, user) {
            $rootScope.user = user;

        });
    });

Comments

[vzhen]

I put it in a service. Then I run it in .run() and I call $scope.user in controller. It always return null, not listening at all. I created another question. stackoverflow.com/questions/18633691/…

[Anton]

you will have to show your code. are you injecting the user service into your controller?

[Anton]

i just looked at your other question. you are on the right path. the authservice just needs to be injected into your controllers or services where ever you need it. as it is a singleton, it will only be logged in once.

[vzhen]

@Anton Still not working. Here is the plunker plnkr.co/edit/lNLhlHh1RET5bxfOB78M?p=preview Please check it, thank you

[Anton]

the plunker gives a 404 not found error. is the url correct?