Javascript AngularJs SPA注销

我在这里发布了更复杂的问题。但我还有另一个方面要看，我认为这应该是一个单独的问题

我有安格尔水疗中心，有认证。使用承载JWT令牌实现身份验证。我使用

ng route

创建不同的视图。让我们想象一下，一个视图（使用

/protected

路由、

protectedcontroller

和

protectedDataService

）包含受保护的资源，另一个视图（使用

/unprotected

路由、

unprotectedcontroller

和

unprotectedDataService

）包含未受保护的资源。控制器示例代码：

(function () {
    'use strict';

    angular
        .module('protectedCtrl',[])
        .controller('protectedController', ['$location','protectedDataService', function ($location, protectedDataService) {
            var vm = this;
            vm.title = 'protectedController';
            protectedDataService.getData().then(function (res) {
                vm.values = res.data;
            }, function (err) {
                console.log(err);
            });
        }]);
})();

无保护控制器：

(function () {
    'use strict';

    angular
        .module('unprotectedCtrl',[])
        .controller('unprotectedController', ['$location','unprotectedDataService', function ($location, unprotectedDataService) {
            var vm = this;
            vm.title = 'unprotectedController';
            unprotectedDataService.getData().then(function (res) {
                vm.values = res.data;
            }, function (err) {
                console.log(err);
            });
        }]);
})();

---

如果卸载的用户转到受保护的资源（

/protected

路径），他将被重定向到登录页面。但让我们想象一下，登录用户按下注销按钮（现在我只需从浏览器本地区删除我的令牌信息并重新加载页面）。如果用户位于

/protected

页面，则应将其重定向到登录页面。如果他在

/unprotected

页面上，则不会发生任何事情。我如何实现这一点？我如何确定哪个页面在

ng视图中处于活动状态（是否需要身份验证）并决定重定向
 您可以使用
$routeChangeStart
事件捕获路由的更改，并使用助手函数决定是否重定向到登录页面

在angular应用程序的
run
块中，为不需要身份验证的路由定义一个变量，并使用一个函数检查用户要前往的路由是否在此列表中

angular
  .module('awesomeApp')
  .run(function (/* inject dependencies */) {
    // other code

    // Define a list of routes that follow a specific rule. This example
    // can be extended to provide access based on user permissions by
    // defining other variables that will list routes that require the
    // user to have specific permissions to access those routes.
    var routesThatDoNotRequireAuthentication = ['/unprotected'];

    // Check if current location is contained in the list of given routes.
    // Note: the check here can be made using different criteria. For
    // this example I check whether the route contains one of the
    // available routes, but you can check for starting position, or other criteria.
    function rootIsPresent ( route, availableRoutes ) {
      var routeFound = false;
      for ( var i = 0, l = availableRoutes.length; i < l; i++ ) {
        routeFound = routeFound || route.indexOf(availableRoutes[i]) > -1;
      }
      return routeFound;
    }

    // And now, when the $routeChangeStart event is fired, check whether
    // its safe to let the user change the route.
    $rootScope.$on('$routeChangeStart', function () {
      // Get the authentication status of a user
      var isAuthenticated = authenticationService.isAuthenticated();
      var newRoute = $location.url();

      // If the route requires authentication and the user is not 
      // authenticated, then redirect to login page.
      if ( !rootIsPresent(newRoute, routesThatDoNotRequireAuthentication) && !isAuthenticated ) {
        $location.path('/login');
      }
    });
});

现在，在
$routeChangeStart
处理程序函数中，检查路由用户是否受到保护：

$rootScope.$on('$routeChangeStart', function () {
      // Get the authentication status of a user
      var isAuthenticated = authenticationService.isAuthenticated();
      var newRoute = $location.url();

      // In a controller, $route object has a 'current' property that
      // holds route defined route properties, but here the 'current'
      // property is null, so we need to get the $route object we 
      // need by using the $location.url()
      if ( $route.routes[$location.url()].requireAuth && !isAuthenticated ) {
        $location.path('/login');
      }
    });

因此，您无需在任何地方对路线进行硬编码。
谢谢。但是根据你的建议，我应该在
routesthattnotrequirereauthentication
数组中注册所有路由。这是一个肮脏的把戏。）也许我可以在定义所有未受保护的路由时为它们留下一些标记？在
app.config（）
或其他地方？或者在某种程度上标记控制器？@Stalso似乎我从字面上理解了这一点，并认为您的路由以protected/unprotected作为前缀。我已经用一个更优雅的解决方案更新了我的答案。谢谢。这是最优雅的解决方案。
$rootScope.$on('$routeChangeStart', function () {
      // Get the authentication status of a user
      var isAuthenticated = authenticationService.isAuthenticated();
      var newRoute = $location.url();

      // In a controller, $route object has a 'current' property that
      // holds route defined route properties, but here the 'current'
      // property is null, so we need to get the $route object we 
      // need by using the $location.url()
      if ( $route.routes[$location.url()].requireAuth && !isAuthenticated ) {
        $location.path('/login');
      }
    });