问题描述
在我登录到应用程序，如果我在浏览器中单击后退按钮它不应该回去再次登录网页（Back按钮应该是禁止在那个时候）。
Once i logged into application,if i click back button in browser it should not go back to login page again(Back button should be disable at that time).
$stateProvider(function('$stateProvider'){
$stateProvider
.state('login',{})
.state('app.home',{})
.state('app.contact',{});
});
从登录页面，即时进入app.home状态，一旦我点击后退按钮它不应该去登录页面（浏览器后退按钮应禁用）。
From login page,im getting into app.home state,once i clicked back button it should not go for login page(Browser back button should be disable).
先谢谢了。
推荐答案
我认为你必须处理一些基本的路由和存储的实现。
I think that you have to deal with some basic routes and storage implementation.
拿这个结构作为认证的一个简单的例子：
我们有回家的URL，默认的，我们有一个登录页面和一个秘密页面。
Take this structure as an easy example of an authentication:we have the home URL, the default one, we have a login page and a secret page.
// Route configuration
var Config = function($stateProvider, $urlRouterProvider){
$stateProvider
.state('home', {
url : '/',
templateUrl : 'home.html'
})
.state('login', {
url : '/login',
controller : 'LoginCtrl',
templateUrl : 'login.html'
})
.state('secret', {
url : '/secret',
templateUrl : 'secret.html',
authenticate : true
})
$urlRouterProvider.otherwise("/");
};
// Dependencie injection
Config.$inject = [
'$stateProvider',
'$urlRouterProvider'
];
// Module declaration
app.config(Config);
秘诀页仅供认证的用户，所以你把在国家本身的参数，以表明此页面需要身份验证。
The secret page is available only for authenticated user, so you put a parameter in the state itself to indicate that this page needs some authentication.
要处理的认证过程，就像重定向，您可以创建，这将有一个事件，听状态改变运行功能。
To deal with the authentication process, like the redirect, you can create a run function which will have an event, listening to state changing.
如果您将达到一个需要身份验证的页面中，您将检查和用户重定向到登录页面。
If you will reach a page that needs authentication, you will check that and redirect the user to the login page.
如果用户已经登录并尝试手动进入登录页面，你将他重定向到主页可能与反馈消息。
If the user is already logged in and try to go manually to the login page, you will redirect him to the home page maybe with a feedback message.
// Initialize the application
var Init = function($rootScope, $state){
$rootScope.$on('$stateChangeStart', function (event, toState, toParams) {
var isLogged = localStorage.getItem('auth');
if(toState.authenticate && isLogged === null){
event.preventDefault();
// Set the url where you will redirect the user after the authentication
$rootScope.returnToState = toState.name;
// Redirect to the login page
$state.go('login');
}
if(isLogged && toState.name === 'login'){
event.preventDefault();
// Redirect to the homepage if the page is the login and
// you are already logged in
$state.go('home');
}
});
};
// Dependencie injection
Init.$inject = [
'$rootScope',
'$state'
];
// Module declaration
app.run(Init);
登录控制器将很容易在这里，但你可以做任何你想做提供身份验证和保存所有参数，你需要
The login controller will be quite easy here, but you can do whatever you want to provide an authentication and save all parameters that you need
// Login Controller
var LoginCtrl = function($scope, $rootScope, $state){
// Share methods
$scope.authenticate = function(){
// Do whatever you want to validate credentials
localStorage.setItem('auth', true);
var redirectPath = angular.isUndefined($rootScope.returnToState) ? 'home' : $rootScope.returnToState;
$state.go(redirectPath);
};
};
// Dependencie injection
LoginCtrl.$inject = [
'$scope',
'$rootScope',
'$state'
];
// Module declaration
app.controller('LoginCtrl', LoginCtrl);
这篇关于停止浏览器早在UI路由器 - angularjs的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！