确保用户使用cookieStore和AngularJS登录或注销的最佳实践
Best practice for ensure user is logged in or out using cookieStore and AngularJS
现在我正在RubyonRails之上构建一个基于AngularJS的应用程序,并使用Devise进行身份验证。当用户身份验证成功和身份验证失败时,我让服务器正确响应。我想我的问题是,使用$cookieStore,了解用户是否登录的最佳实践是什么?Rails设置了一个cookie,名为"myapp_session",但该会话并不一定意味着用户已经登录。正在寻找如何使用AngularJS来保持用户在线/离线管理的想法。无论解决方案如何,我仍将确保需要授权的请求得到后端的授权。
您可以创建一个指令,在应用程序加载时设置记录的用户,例如,请求服务器上的当前用户会话。
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);
}
};
}])
;
并在AppController
:中设置您的run
方法
.run(['Auth', 'UserRestService', function run(Auth, UserRestService) {
var _user = UserRestService.requestCurrentUser();
Auth.set(_user);
}])
当然,如果对服务器的任何请求都返回Http Status 401 - Unauthorized
,则需要调用Auth.remove()
服务将用户从cookie中删除,并将用户重定向到登录页面。
我使用这种方法,效果非常好。您也可以使用localStorage
,但用户数据将被长期保存。除非您设置此身份验证的截止日期,否则我认为这不是最佳实践。
请记住,始终验证服务器站点上的用户凭据=)
[EDIT]
要监听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
路径的登录页面。
你会在这里找到一个很好的例子
您可以使用在登录回调中设置cookie
$cookieStore.put('logged-in', some_value)
然后在他们使用进入您的网站时进行检查
.run(function($cookieStore) {
if ($cookieStore.get('logged-in') === some_value) {
let him enter
}
else {
you shall not pass
}
});
也许还有更多"正确"的方法,但这是有效的。
如果您在使接受的答案发挥作用方面遇到问题,请注意,从Angular 1.3开始,添加新拦截器的正确方法是将其添加到$httpProvider.interceptors中,因此不要:
$httpProvider.responseInterceptors.push(interceptor);
用途:
$httpProvider.interceptors.push(interceptor);
- 在localhost Dev Box上测试JSONP请求的最佳方式
- 有条件更新d3.js力图中节点的最佳方法
- 为react组件传递道具的最佳方式
- 与运行长作业(javascript,node.js)的第三方API同步的最佳实践
- 让Webpack管理Quirky AMD定义的最佳方式
- 在承诺链中处理早期回报的最佳方式
- 将jQuery.ech()方法转换为本地JavaScript抽象的最佳方法是什么
- Angularjs 1.5.x本地化最佳实践
- 处理浮点错误的最佳方法是什么
- javascript导入的最佳实践是什么
- MobileFirst:在客户端运行计时器作业-最佳选项
- 显示具有服务器端自动时间注销的同步倒计时计时器
- 在ng重复循环中显示条件内容的最佳方式是什么
- 在phonegap中为android调用onload函数的最佳方式
- 实现比较方法的最佳实践是什么;s的比较类型是在运行时选择的
- 从数组中删除元素的最佳方法是:javascript/jquery
- 我们如何在互联网断开连接或用户关闭选项卡/浏览器时调用注销servlet
- 确保用户使用cookieStore和AngularJS登录或注销的最佳实践
- 网站的Facebook登录:处理用户Facebook注销的最佳实践
- 实现web应用程序空闲超时(自动注销)的最佳方法是什么?