Asp.net + AngularJS使用Razor渲染授权

Question

我想创建一个SPA站点，使用ASP.Net作为后端，Angular作为前端框架。我现在面临的问题是，如何管理用户/角色？具体来说是查看授权的最佳方法（根据角色显示不同的菜单项）。

我正在考虑依赖Razor，只是为了查看授权（使用'User.IsInRole'）做的事情：

@if (Request.IsAuthenticated && User.IsInRole("Administrators"))
{
     <div id="sidebar">
        <div class="module">
           <ul class="menu">
              <li>@Html.ActionLink("Home", "Index", "Home")</li>
              <li>@Html.ActionLink("About", "About", "Home")</li>
              <li>@Html.ActionLink("Contact", "Contact", "Home")</li>
            </ul>
         </div>
         <div class="mainContent">
             Hello, @User.Identity.Name !
         </div>
     </div>
}

我知道这不是最优雅的解决方案，但最佳替代方案是什么？

Answer 1

您可以在身份验证控制器中实现身份验证方法，并在角度js端使用此模块。请参阅以下链接

https://github.com/witoldsz/angular-http-auth

哪个可能有帮助

Answer 2

考虑使用角度ui-router或ng-route

我会说使用每个状态的resolve函数，因为你可以调用服务器获取User对象，如果它是登录的，根据服务器的响应返回，我们将设置值authenticationSvc服务。

基本上User位于authenticationSvc内，您可以将用户角色放在其中。

示例

$routeProvider.when("/", {
  templateUrl: "templates/home.html",
  controller: "HomeController",
  resolve: {
    auth: ["$q", "authenticationSvc", function($q, authenticationSvc) {
      var userInfo = authenticationSvc.getUserInfo();

      if (userInfo) {
        return $q.when(userInfo);
      } else {
        return $q.reject({ authenticated: false });
      }
    }]
  }
});

<强>控制器

$scope.userInfo = authenticationSvc.getUserInfo();

<强>标记

 <div id="sidebar">
    <div class="module" ng-if="userInfo.roles['Administrators']">
       <ul class="menu">
          <li>@Html.ActionLink("Home", "Index", "Home")</li>
          <li>@Html.ActionLink("About", "About", "Home")</li>
          <li>@Html.ActionLink("Contact", "Contact", "Home")</li>
        </ul>
     </div>
     <div class="mainContent">
         Hello, @User.Identity.Name !
     </div>
 </div>

另请参阅this link将帮助您实施。