确保用户使用cookieStore和AngularJS登录或注销的最佳实践

Question

现在我正在Ruby on Rails上构建一个基于AngularJS的应用程序,并使用Devise进行身份验证.当用户成功进行身份验证以及身份验证失败时,我让服务器正确响应.我想我的问题是,使用$ cookieStore,了解用户是否登录的最佳做法是什么？有一个由Rails设置的cookie称为"myapp_session",但该会话并不一定意味着用户已登录.寻找有关如何使用AngularJS来保持用户在线/离线管理的想法.无论解决方案如何,我仍然会确保需要授权的请求得到后端的授权.

Answer 1

您可以创建一个指令,在应用程序加载时设置已记录的用户,例如,请求服务器上的当前用户会话.

angular.module('Auth', [
        'ngCookies'
    ])
    .factory('Auth', ['$cookieStore', function ($cookieStore) {

        var _user = {};

        return {

            user : _user,

            set: function (_user) {
                // you can retrive a user setted from another page, like login sucessful page.
                existing_cookie_user = $cookieStore.get('current.user');
                _user =  _user || existing_cookie_user;
                $cookieStore.put('current.user', _user);
            },

            remove: function () {
                $cookieStore.remove('current.user', _user);
            }
        };
    }])
;

并在您的run方法中设置AppController:

   .run(['Auth', 'UserRestService', function run(Auth, UserRestService) {

            var _user = UserRestService.requestCurrentUser();
            Auth.set(_user);
        }])

当然,如果对服务器的任何请求返回Http Status 401 - Unauthorized,则需要调用该Auth.remove()服务以从cookie中删除用户并将用户重定向到登录页面.

我使用这种方法并且效果很好.您也可以使用localStorage,但用户数据将持续很长时间.除非您为此身份验证设置了截止日期,否则我认为不是最佳做法.

请记住始终验证服务器站点上的用户凭据=)

[编辑]

要收听401 - Unauthorized服务器响应,您可以在$http请求中放置拦截器,如下所示:

 .config(['$urlRouterProvider', '$routeProvider', '$locationProvider', '$httpProvider', function ($urlRouterProvider, $routeProvider, $locationProvider, $httpProvider) {
        $urlRouterProvider.otherwise('/home');
        var interceptor = ['$location', '$q', function ($location, $q) {

            function success(response) {
                return response;
            }

            function error(response) {

                if (response.status === 401) {
                    $location.path('/login');
                    return $q.reject(response);
                }
                else {
                    return $q.reject(response);
                }
            }

            return function (promise) {
                return promise.then(success, error);
            };
        }];

        $httpProvider.responseInterceptors.push(interceptor);
    }])

每次呼叫都有401响应,用户将被重定向到/login路径的登录页面.

你会在这里找到一个很好的例子