How to keep globally current user until logout with angular_devise?

As we know factory is a singleton object and basically it is used for data sharing. We can inject it to any controller and functions as an dependency.So this may be also solve your problem. inject this service to your state resolve block and check if user exists or not if not then call the fetch user function of factory

app.factory("User", function($http, $q, $rootScope) {var user = null;return {    fetchUser: function() {        /*your ajax call that return current user*/        user = YOUR_SERVER_RESPONSE;        return user;    },    getUser : function(){        return user;    },    setUser : function(u){        user = u;    }}

});

and your state config block is look like

  .state('dashboard', {  url: '/dashboard',  templateUrl: 'dashboard.html',  resolve : function(User){    if(User.getUser()){        return User.getUser();    }else{        return User.fetchUser();    }  }})

I've had to deal with user Authentication in a large Angular app and found this article very useful: https://medium.com/opinionated-angularjs/techniques-for-authentication-in-angularjs-applications-7bbf0346acec

Specific to 'how to make it happen only once':

• you can call the init() of the Service in an app.run block
• adding it as a resolve requirement of an outer state for the app (if you use nested states)

A UserService Service to represent user's logged in state works well for sharing state throughout the application. The login and logout functions can be exposed through this service and the user's details can be stored here too. Defining a UserApi that extends $resource will probably help too to separate the actual HTTP concerns from managing user state.

Other concerns that will catch you, both of which are covered in the article: persistent state across page refreshes, and having areas of the site that are only accessible when the user is logged in.

I solved the issue of current_user information with angular by adding the following JavaScript (jQuery) code to the bottom of my main HTML page:

$("meta[name=current_user]").data('current_user', {    id: <%=j current_user.id.to_s %>,     username: "<%=j current_user.full_name.to_s %>"});

You can parse in whatever information you need, this happens to be a Rails Project and all I needed was the ID and NAME (with the ID I could query the User factory object and receive a JSON with full information if I needed).

Then in your AngularJS Controller you can add (mine is coffeescript):

# Grab User Infocurrent_user = angular.element("meta[name=current_user]").data 'current_user'# Stop Here if you Have the Info you Need$scope.user = current_user# **** OR Get More Info if User is Logged In if current_user.id is not undefined   $scope.user = User.get {id: current_user.id}

Here is my Factory Code for the User (coffeescript again):

# In order to prevent minification from effecting the code# must wrap functions as arrays and pass in the variables as # strings before the function callapp.factory "User", ["$resource", ($resource) ->    $resource("/api/angular/users/:id",     { id: "@id" },     {        update: { method: "PUT" }    })]

Let me know if you have any questions.