我希望Angular在每次路由更改时检查身份验证。我的代码看起来像这样。
config.js
angular.module('message').run(['$rootScope', '$location', 'Auth', function ($rootScope, $location, Auth) {
$rootScope.$on('$routeChangeStart', function (event) {
if (!Auth.isLoggedIn()) {
console.log('DENY');
event.preventDefault();
$location.path('/Login');
}
else {
console.log('ALLOW');
$location.path('/home');
}
});
}]);
authenticationService.js
var app=angular.module('message');
app.factory('Auth', function($rootScope){
return{
setUser : function(aUser){
$rootScope.user = aUser;
},
isLoggedIn : function(){
return($rootScope.user)? $rootScope.user : false;
}
}
})
我的app.js看起来像这样
var app=angular.module('message',['restangular','ngRoute']);
app.config(['$routeProvider', function ($routeProvider){
$routeProvider
.when("/", {
templateUrl : "view/user.html",
controller : "loginController"
})
.when("/NewUser", {
templateUrl : "view/addUser.html",
controller : "MainCtrl"
})
.when("/ViewUsers", {
templateUrl : "view/ViewUsers.html",
controller : "MainCtrl"
})
.when("/EditUser/:id", {
templateUrl : "view/EditUser.html",
controller : "MainCtrl"
})
.when("/Register", {
templateUrl : "view/Register.html",
controller : "RegisterController"
})
.when("/Login", {
templateUrl : "view/user.html",
controller : "loginController"
})
.when("/Home", {
templateUrl : "view/Home.html",
controller : "HomeController"
})
.when("/ForgotPassword", {
templateUrl : "view/Home.html",
controller : "ForgotController"
});
}]);
app.controller('MainCtrl',function($scope,Restangular,$location,$routeParams,$http,Auth){
Restangular.setBaseUrl('webapi');
//watch to work on user state changed
$scope.$watch(Auth.isLoggedIn, function (value, oldValue) {
if(!value && oldValue) {
console.log("Disconnect");
$location.path('/Login');
}
if(value) {
console.log("Connect");
//Do something when the user is connected
$location.path('/Home');
}
}, true);
//setting profile name as id for profiles model
var index = $routeParams.id;
$scope.index=index;
console.log($scope.index)
var profiles = Restangular.all('profiles');
Restangular.setRestangularFields({
id: "_id"
});
Restangular.extendModel('profile', function(profile) {
profile.id = profile.profileName;
});
Restangular.addResponseInterceptor(function (data, operation, what, url, response, deferred) {
if (operation == "getList") {
return response.data;
}
return response+=response.data;
});
data=function(user){
consle.log(user);
}
// This will query /profiles and return a promise.
profiles.getList().then(function(profiles) {
$scope.profiles = profiles;
$scope.saveUser=function(){
$scope.profile.profileName=$scope.profile.firstName+$scope.profile.lastName;
console.log($scope.profile);
profiles.post($scope.profile);
}
$scope.showUser=function(id){
$location.path('/EditUser/'+id);
}
$scope.editUser=function(id){
//put requestusing http
var probject={};
probject.firstName=profiles[id].firstName;
probject.lastName=profiles[id].lastName;
probject.profileName=profiles[id].profileName;
probject.id=profiles[id].id;
probject.created=profiles[id].created;
$http.put("http://localhost:8080/messenger/webapi/profiles/"+$scope.profiles[id].profileName,probject).then(function(data){
console.log(data);
});
}
});
$scope.go = function ( path ) {
$location.path( path );
};
});
我面临的问题是我的代码在没有config.js的情况下运行良好 但每当我使用config.js使用身份验证服务注册$ onroutechange事件时,我的代码会停止工作而不会出现任何错误。
我可能正在做一些愚蠢的事情,因为我是棱角分明的新手。 请帮忙。
答案 0 :(得分:2)
尝试这样的事情:
$rootScope.$on('$routeChangeStart', function (event, next) {
if (next.$$route.originalPath!=='/Login' && !Auth.isLoggedIn()) {
...
否则你会陷入无限循环。