当用户点击后退按钮时，他们会退出 angularjs 应用程序，我该如何防止这种情况发生？答案

【问题标题】：When user hits back button they get logged out of angularjs application, how do I prevent this?当用户点击后退按钮时，他们会退出 angularjs 应用程序，我该如何防止这种情况发生？
【发布时间】：2018-07-04 07:12:40
【问题描述】：

我正在使用 angularjs 构建一个应用程序，其中包含一个 PHP Web api，它用于获取运行所需的数据。我找到了一种很好地设置路由并让用户登录的方法，但我注意到当他们在登录后点击返回按钮时，他们会被注销。

 (function () {
     'use strict';

     angular
         .module('app', ['ngRoute', 'ngCookies'])
         .config(config)
         .run(run);

     config.$inject = ['$routeProvider', '$locationProvider'];
     function config($routeProvider, $locationProvider) {
         $routeProvider
             .when('/', {
                 controller: 'HomeController',
                 templateUrl: 'pages/home.html',
                 controllerAs: 'vm'
             })

             .when('/about', {
                 controller: 'AboutController',
                 templateUrl: 'pages/about.html',
                 controllerAs: 'vm'
             })

             .when('/login', {
                 controller: 'LoginController',
                 templateUrl: 'pages/login.html',
                 controllerAs: 'vm'
             })

             .when('/register', {
                 controller: 'RegisterController',
                 templateUrl: 'pages/register.html',
                 controllerAs: 'vm'
             })

             .when('/calendar', {
                 controller: 'CalendarController',
                 templateUrl: 'pages/calendar.html',
                 controllerAs: 'vm'
             })

             .when('/newsfeed', {
                 controller: 'FeedController',
                 templateUrl: 'pages/newsfeed.html',
                 controllerAs: 'vm'
             })

             .when('/favorites', {
                 controller: 'FavoritesController',
                 templateUrl: 'pages/favorites.html',
                 controllerAs: 'vm'
             })

             .when('/chat', {
                 controller: 'ChatController',
                 templateUrl: 'pages/chat.html',
                 controllerAs: 'vm'
             })

             .when('/contact', {
                 controller: 'ContactController',
                 templateUrl: 'pages/contact.html',
                 controllerAs: 'vm'
             })

             .when('/settings', {
                 controller: 'SettingsController',
                 templateUrl: 'pages/settings.html',
                 controllerAs: 'vm'
             })

             .when('/personal', {
                 controller: 'ProfileController',
                 templateUrl: 'pages/personal.html',
                 controllerAs: 'vm'
             })

             .when('/stats', {
                 controller: 'StatsController',
                 templateUrl: 'pages/stats.html',
                 controllerAs: 'vm'
             })

             .when('/requests', {
                 controller: 'RequestController',
                 templateUrl: 'pages/requests.html',
                 controllerAs: 'vm'
             })

             .when('/change-password', {
                 controller: 'RegisterController',
                 templateUrl: 'pages/change-password.html',
                 controllerAs: 'vm'
             })

             .when('/weather', {
                 controller: 'WeatherController',
                 templateUrl: 'pages/weather.html',
                 controllerAs: 'vm'
             })

             .otherwise({ redirectTo: '/login' });
         $locationProvider.html5Mode({
             enabled: true,
             requireBase: true
         });
         $locationProvider.hashPrefix('');
     }

     run.$inject = ['$rootScope', '$location', '$cookies', '$http'];
     function run($rootScope, $location, $cookies, $http) {
         // keep user logged in after page refresh
         $rootScope.globals = $cookies.getObject('globals') || {};
         if ($rootScope.globals.currentUser) {
             $http.defaults.headers.common['Authorization'] = 'Basic ' + $rootScope.globals.currentUser.authdata;
         }

         $rootScope.$on('$locationChangeStart', function (event, next, current) {
             // redirect to login page if not logged in and trying to access a restricted page
             var restrictedPage = $.inArray($location.path(), ['/login', '/register']) === -1;
             var loggedIn = $rootScope.globals.currentUser;
             if (restrictedPage && !loggedIn) {
                 $location.path('/');
             }
         });
     }

     function HeaderCtrl($scope) {
         $scope.header = {name: "frame.html", url: "frame.html"};
     }

 })();

我已经尝试在其他一些帖子中添加我喜欢的内容，但没有任何运气：

         $rootScope.$on('$stateChangeStart', function(event, toState, toParams,
                                                      fromState, fromParams){
             var loggedIn = $rootScope.globals.currentUser;
             //userIsLogged is a flag you should retrieve from your code
             if(loggedIn && toState === 'login'){
                 event.preventDefault();
             }
         });

如果有帮助的话，我也有一个身份验证服务，不过它应该将 cookie 设置为一周。

任何帮助将不胜感激，并提前致谢！

【问题讨论】：

我认为$stateChangeStart 是旧版本的ui-router 与您正在使用的ngRoute 不同。
嘿，谢谢！之后我意识到了这一点。我结束了对全局变量的检查，如果已经登录，则强制重新路由到仪表板。我会尽快发布解决方案，如果有人有改进它的建议，因为它看起来有点 hacky，我很乐意听到。

标签： angularjs authentication session-cookies session-state

【解决方案1】：

我添加/编辑了下面的 sn-p 以暂时解决此问题：

    $rootScope.$on('$locationChangeStart', function (event, next, current) {
        // redirect to login page if not logged in and trying to access a restricted page
        var restrictedPage = $.inArray($location.path(), ['/login', '/register']) === -1;
        var loggedIn = $rootScope.globals.currentUser;
        if (restrictedPage && !loggedIn) {
            $location.path('/login');
        } else if ($location.path() === '/login' && loggedIn) {
            $location.path('/');
        }
    });

【讨论】：