Question

在登录操作中，我在localstorage username和token内存储了已登录的用户，之后我创建了auth。发布请求的标题。

更新：更具体地说明这一点。我有userService succ。从本地存储中放置和检索用户数据，我有username，sessionId和isLogged。

我的问题是：现在有了Auth。 header，我需要关于localstorage中记录用户的所有信息，如何编写一个事件处理程序来检查用户是否在每次路由更改之前登录。

我应该在我启动应用程序并注入userService的app.js上执行此操作吗？如果是的话。

(function () {
    "use strict";
    var app = angular.module("myApp",
        ["common.services",
            "ui.router",
            "ui.mask",
            "userService", 
            "ui.bootstrap"]);
    ....

我现在如何使用此存储的auth标头来访问/拒绝访问特定页面？

更新2：app.js

(function () {
    "use strict";
    var app = angular.module("myApp",
        ["common.services",
            "ui.router",
            "ui.mask",
            "userService",
            "ui.bootstrap"]);        

    app.config(["$stateProvider", "$urlRouterProvider",
            function ($stateProvider, $urlRouterProvider) {
                $urlRouterProvider.otherwise("/");

                $stateProvider
                    .state("index", {
                        url: "/",
                        templateUrl: "app/index.html",
                    })
                    // Restricted
                    .state("home", {
                        url: "/home",
                        templateUrl: "app/home/home.html",
                        controller: "HomeController as vm"
                    })
            }]
    );
}());

Answer 1

您可以通过使用自定义属性标记所需路径并在“位置”更改时验证该标记是否有效来实现此目的。

更新假设您可以通过选中isLogged的{{1}}属性来验证用户是否已通过身份验证：

userService

Answer 2

我认为解决问题的正确方法是在路由中使用resolve属性，因此如果用户未登录，则用户无法导航到某些页面，一旦登录，您可以将用户对象注入控制器

例如，要导航到您必须登录的主页

.when("/home", {
templateUrl: "homeView.html",
controller: "homeController",
resolve: {
    user: function(AuthenticationService){
      return AuthenticationService.getUser();
    }
  }
})

app.controller("homeController", function ($scope, user) {
   $scope.user = user;
});

很好的例子：https://www.sitepoint.com/implementing-authentication-angular-applications/

使用auth标头来阻止访问页面

2 个答案: