Angularjs ui-路由器。如何重定向到登录页面
我有4种状态：dashboard，dahboard.main，dashboard.minor，login。仪表板是抽象的，它是.minor和.main状态的父状态。下面是我的代码：
.state('dashboard', {
url: "/dashboard",
abstract: true,
templateUrl: "views/dashboard.html",
resolve: {
auth: function ($q, authenticationSvc) {
var userInfo = authenticationSvc.getUserInfo();
if (userInfo) {
return $q.when(userInfo);
} else {
return $q.reject({ authenticated: false });
}
}
},
controller: "DashboardCtrl",
data: { pageTitle: 'Example view' }
})
.state('dashboard.main', {
url: "",
templateUrl: "views/main.html",
controller: "DashboardCtrl",
data: { pageTitle: 'Main view' }
})正如您在仪表板状态中看到的，我有resolve选项。通过这个，我想将用户重定向到登录页面，如果他没有授权。因此，我使用特殊的authenticationSvc服务：
.factory("authenticationSvc", ["$http", "$q", "$window", function ($http, $q, $window) {
var userInfo;
function login(email, password) {
var deferred = $q.defer();
$http.post("/api/login", { email: email, password: password })
.then(function (result) {
if(result.data.error == 0) {
userInfo = {
accessToken: result.data.accessToken
};
$window.sessionStorage["userInfo"] = JSON.stringify(userInfo);
deferred.resolve(userInfo);
}
else {
deferred.reject(error);
}
}, function (error) {
deferred.reject(error);
});
return deferred.promise;
}
function getUserInfo() {
return userInfo;
}
return {
login: login,
logout: logout,
getUserInfo: getUserInfo
};
}]);我检查配置中的AUTH值：
.run(function($rootScope, $location, $state) {
$rootScope.$state = $state;
$rootScope.$on("routeChangeSuccess", function(userInfo) {
consol.log(userInfo);
});
$rootScope.$on("routeChangeError", function(event, current, previous, eventObj) {
if(eventObj.authenticated === false) {
$state.go('login');
}
});
});但不幸的是，当我转到我的网站根目录或仪表板状态时，我得到一个空页面。这段代码有什么问题？谢谢!
回答 3
Stack Overflow用户
发布于 2014-12-01 00:12:38
重点是，如果不需要===，如果已经重定向到预期状态，则不要重定向。a working plunker也有类似的解决方案
.run(function($rootScope, $location, $state, authenticationSvc) {
$rootScope.$on( '$stateChangeStart', function(e, toState , toParams
, fromState, fromParams) {
var isLogin = toState.name === "login";
if(isLogin){
return; // no need to redirect
}
// now, redirect only not authenticated
var userInfo = authenticationSvc.getUserInfo();
if(userInfo.authenticated === false) {
e.preventDefault(); // stop current execution
$state.go('login'); // go to login
}
});
});有关类似的解释，请查看以下内容：
Stack Overflow用户
发布于 2014-11-30 21:30:46
由于您使用的是UI-Router模块，因此您应该使用$stateChangeStart、$stateChangeSuccess events。
有关更多信息，请查看此链接：https://github.com/angular-ui/ui-router/issues/17
此外，在控制台中的consol.log(userInfo)中也有一个拼写错误。
在chrome-dev-tools中检查控制台。如果缺少其他东西，它会给出答案。
Stack Overflow用户
发布于 2018-03-09 09:29:27
请注意，实际上$stateChangeSuccess事件已被弃用，并且在angular-ui-route包中不再可用。现在，此行为由transition hooks处理。您可以使用$transitions.onStart实现您的目的，如下所示：
run.$inject = ['$transitions', 'authenticationSvc'];
function run($transitions, authenticationSvc) {
$transitions.onStart({}, function (trans) {
var userInfo = authenticationSvc.getUserInfo();
var $state = trans.router.stateService;
if(userInfo.authenticated === false) {
$state.go('login'); // go to login
}
});
}https://stackoverflow.com/questions/27212182
复制相似问题
腾讯云开发者
