我想在AngularJS中实现授权。在我的项目中，某种社交媒体，不同的角色甚至相同的角色可能会以不同的方式看到视图文件。
例如，假设我们有两个不同的角色：客户和公司。
客户和公司在共享视图文件中可能有不同的内容，例如，公司可以对其个人资料进行评分，而客户则不能。 （不同的角色）。
或者客户可能会在页面中看到一个按钮而另一个客户却看不到。 （同样的角色）
如您所见，我无法通过简单地检查角色来实现授权，在某些情况下，我需要与服务器进行通信。
我有多种选择：
在我的控制器范围内使用相应的权限创建一个变量，它们的默认值为false：
$scope.auth = {
canRate: false,
isConnected: false
};
然后连接到服务器并根据响应更改auth对象的值。并在我的视图文件中使用ng-if来显示或隐藏元素。
创建一个指令并将逗号分隔的权限传递给它。
<button auth="canRate,isConnected"></button>
然后连接到服务器以检查权限。如果所有这些都是真的，那么显示元素。
resolve: {...}并在路由时从服务器获取所有必要的数据，这会增加每个页面的加载时间。 我想知道有没有更好的方法来解决这个问题？ 任何形式的帮助或评论都将不胜感激。
注意：当然我有服务器端身份验证和授权！我只是想根据用户角色或我解释的一些其他条件在视图文件中显示一些元素。这些元素类似于按钮或链接，否则不是使用共享视图和隐藏元素，我可以为每种情况使用不同的视图。
如何，我知道这些方法仅用于显示目的，并且它们无法解决安全挑战。
答案 0 :(得分：2)
首先，我喜欢AngularJS。但是，与所有Web客户端框架一样，严格来说，您无法在AngularJS中实现授权。现在，在每个人都达到向下投票按钮之前，让我解释一下：
您无法信任Web客户端隐藏用户的数据。如果服务器将数据发送到客户端，即使您使用ng-hide来避免显示数据，他们仍然可以找到查看它的方法（例如使用fiddler）。
因此，您必须在服务器端实施授权。现在，假设你这样做：
AngularJS非常适合根据您从服务器收到的数据构建动态Web界面。因此，您的服务器应该只发送您的客户端可以看到的数据。然后，您可以使用ng-hide或ng-if来避免显示否则会显示该数据的组件。
此外，您的服务器甚至可以发送包含用户可用操作列表的对象。然后你可以在按钮中使用ng-hide，以便在动作不可用时不显示它们。
即便如此，您仍需要对服务器端进行编码，以忽略不允许用户执行的操作。
答案 1 :(得分：1)
您的方法可行，但不安全。我会确保服务器也处理身份验证。就个人而言，在使用AngularJS时，我总是使用基于服务器端令牌的身份验证系统。
您应该使您的GET或POST请求需要登录时提供的令牌，而不是使用ng-if。从那里，服务器可以确定是否允许请求成功，而用户不会伪造凭证。您的两个示例都可以正常工作，但可以将它们用作隐藏内容仅用于显示目的的方法。 Web客户端不会保护敏感信息的安全，也不会阻止来自不受欢迎用户的POST请求。