当用户点击后退按钮时,他们会退出 angularjs 应用程序,我该如何防止这种情况发生?
When user hits back button they get logged out of angularjs application, how do I prevent this?
我正在 angularjs 中构建一个应用程序,其中包含一个 PHP 网络 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 一周。
如有任何帮助,我们将不胜感激,在此先致谢!
我 added/edited 下面的代码片段暂时解决了这个问题:
$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('/');
}
});
我正在 angularjs 中构建一个应用程序,其中包含一个 PHP 网络 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 一周。
如有任何帮助,我们将不胜感激,在此先致谢!
我 added/edited 下面的代码片段暂时解决了这个问题:
$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('/');
}
});