【发布时间】：2016-09-09 14:09:14
【问题描述】：
Strongloop/loopback 具有内置 ACL 来限制对属性和函数的访问。我的问题是，在使用 AngularSDK 时，是否有适当的方法来限制对页面的访问？
如何在前端查看授权状态？我正在使用 ui-router。
【问题讨论】：
标签： angularjs loopbackjs strongloop
【发布时间】：2016-09-09 14:09:14
【问题描述】：
检查文档的AngularSDK Handling 401 Unauthorized section。您可以设置一个处理程序来检测 API 调用何时返回 401 Unauthorized 响应代码并让您的 UI 呈现登录表单。我已经完成了模式和整页重定向，这取决于您的敏感性和您的 ui-router 东西的结构。
将以下代码（或类似代码）放入您的 app.js 内的 .config() 块内。
文档中的逐字记录：
// Inside app config block
$httpProvider.interceptors.push(function($q, $location, LoopBackAuth) {
return {
responseError: function(rejection) {
if (rejection.status == 401) {
//Now clearing the loopback values from client browser for safe logout...
LoopBackAuth.clearUser();
LoopBackAuth.clearStorage();
$location.nextAfterLogin = $location.path();
$location.path('/login');
}
return $q.reject(rejection);
}
};
});
// In the Login controller
User.login($scope.credentials, function() {
var next = $location.nextAfterLogin || '/';
$location.nextAfterLogin = null;
$location.path(next);
});
鉴于此，您可以在.run() 块中向$stateChangeStart 添加事件侦听器 -
$rootScope.$on('$stateChangeStart', function(event, toState, toParams, fromState, fromParams) {
// API call here to check if you get (or simply trigger) a 401
// whitelist states that can be accessed publicly
// or blacklist states that cannot be accessed without auth
// whichever is more straightforward
// lots of attributes available to check for various metadata attached to states and determine yes/no to continue the state change
});
请参阅此处了解$stateChangeStart 和传递给回调的参数：
http://angular-ui.github.io/ui-router/site/#/api/ui.router.state.$state
因此，虽然用户确实可以完全控制他们的浏览器并阻止此检查并强制浏览器加载视图，但他们仍然无法访问任何需要有效令牌的 API 调用。因此，只要您的敏感远程方法上有适当的 ACL，视图就会加载，但数据不会加载。
【讨论】：
-
我正在处理未经授权的请求。我无法根据用户的角色隐藏菜单。例如，管理员菜单需要只对属于管理员角色的用户可见。
通常前端的授权是有问题的，因为用户可以控制他的所有浏览器。因此，您应该在后端实现授权部分。客户端可能会发送不允许的请求，但服务器应确保它们不会被执行。
为了在授权后启用部件，您可以执行哪些操作，您可以有条件地在服务器端模板中加载其他文件。这可能是一个设置某些字段的 JS 文件。不幸的是，这并不能避免用户操纵您的网站并规避某些安全措施。
【讨论】：
与 Strongloop 一起使用时，隐藏/禁用相关菜单、按钮或任何控件变得困难。这就是为什么我不得不发布这个问题。
将授权耦合到 AngularJS 前端和 Strongloop API 的最佳方式是点击链接。
【讨论】：