UI 路由器和 Satellizer 强制登录

Question

我知道这个问题不是很具体，但我不知道如何解决这个问题或者我应该从哪里开始..

我正在使用 Satellizer 通过 UI-Router 进行身份验证。问题是我有 2 条路由 /sign_in 和 /profile /sign_in 向服务器发出请求返回用户信息（成功登录时）...这个 currentUser 信息是在整个应用程序中使用...

问题是当用户尝试在登录前转到 /profile 时，它会呈现空视图...如何强制用户在访问这些 "restricted" 视图之前先登录？！

同样，我知道这不是一个具体问题，但我真的不知道从哪里开始

Answer 1

看看如何处理 UI 路由器上的 routechangestart 事件，我做了类似的事情。

我想这会给你一些线索http://arthur.gonigberg.com/2013/06/29/angularjs-role-based-auth/

关键是您需要创建某种形式的身份验证服务，您可以在其中存储用户的登录状态，并且由于服务被调用一次（单例），因此它会在您的应用程序（控制器、其他服务等）。然后在 routechangestart 事件处理中，如果用户未通过身份验证，您可以阻止路由到目标页面并重定向到登录。

Answer 2

我在这个Github Repo

中找到了答案

我们的想法是使用 Repo 自述文件中讨论的基于角色的身份验证。

所以禁止未经授权访问 /profile 的代码将类似于以下内容

  $stateProvider.state("profile", {
    url: "/profile",
    templateUrl: "app/profile/profile.html",
    controller: "ProfileCtrl",
    controllerAs: "user",
    data: {
      permissions: {
        except: ['guest'],
        redirectTo: 'sign_in'
      }
    }
  });

假设您定义了 guest 角色

definePermissions = function(Permission, Identity) {
  Permission.defineRole('guest', function(stateParams) {
    return !Identity.currentUser;
  });
};

UI 路由器和 Satellizer 强制登录

UI Router and Satellizer force login

angularjs

authentication

angular-ui-router

satellizer

我在这个Github Repo