为此,可以在 $stateProvider
中使用 服务 吗?
我已经阅读了很多关于路由的堆栈帖子,但大多数帖子都让初学者感到困惑,因为每个人都使用不同的方法并将其视为火箭科学。我想从一开始就养成好习惯,避免坏习惯……
目标 :在应用程序启动之前运行一些函数,并基于我的最终用户的输出路径。
我尝试过的:
实现一个服务>> AuthService
|操作 >> 简单检查:
服务提供商
myApp.factory('AuthService', function ( Session) {
var authService = {};
authService.isAuthorized = function(){
return Session.authorized() ;
};
return authService;
});
myApp.service('Session', function ($resource, $q, $timeout, URL_Config) {
this.authorized = function () {
var deferred = $q.defer();
$timeout(function () {
var db = window.openDatabase("config.db", "1.0", "Config", 2 * 1024 * 1024);
db.transaction(function (tx) {
tx.executeSql("SELECT * FROM user_details", [], function (tx, data) {
var token = data.rows.item(0).token;
var request = $resource(URL_Config.BASE_URL + '/authCheck', {token: token },
{ query: {
isArray: false,
method: 'GET'
} });
request.query(function (res) {
if (res.error) {
deferred.resolve(false);
} else {
deferred.resolve(true);
}
});
}, function (e) {
deferred.resolve(false);
});
});
}, 500);
return deferred.promise;
};
return this;
});
路由配置
这是我正在努力解决的部分。在哪里以及如何注入(inject)此服务?我让它工作了,但我不确定这是否是处理它的正确方法。
$stateProvider
的 Resolve 属性中调用服务? AuthService
的值重定向查看 myApp.config(function($stateProvider, $urlRouterProvider ) {
$urlRouterProvider.otherwise('/home');
$stateProvider
.state('home', {
url: '/home',
templateUrl: 'templates/home.html',
controller: 'MainController',
resolve: ['AuthService', function(AuthService, $location, $q){
var deferred = $q.defer();
var authChk = AuthService.isAuthorized();
authChk.then(function(data){
if(!data){
$location.path('/register');
deferred.resolve();
} else{
$location.path('/home');
deferred.resolve();
}
}, function(e){
$location.path('/register');
deferred.resolve();
});
return deferred.promise;
}]
})
.state('register', {
url: '/register',
templateUrl: 'templates/register.html',
controller : 'RegisterController',
resolve: ['AuthService', function(AuthService, $location, $q){
var deferred = $q.defer();
var authChk = AuthService.isAuthorized();
authChk.then(function(data){
if(!data){
$location.path('/register');
deferred.resolve();
} else{
$location.path('/home');
deferred.resolve();
}
}, function(e){
$location.path('/register');
deferred.resolve();
});
return deferred.promise;
}]
})
});
这是运行此类身份验证验证的正确位置吗?
这是一个简单的 Hello World 演示,让我开始使用 Angular。我没有导航(多 View ),所以检查应该是直接的。
我见过很多使用
locationChangeStart
在加载 View 之前触发服务的示例。然后在处理 session 时使用 $scope.watch
和 $broadcast
(也不是这种情况),但可能对将来的使用有用。谢谢。欢迎任何有关如何以及在何处处理这种情况的建议。
最佳答案
这实际上也是我不得不做的事情。您可以在每个状态上使用 resolve
。
在下面的代码中,我有一个 resolveUserAuth 函数,它将返回用户对象。
var resolveUserAuth = {
'userAuth': function (AuthService, $rootScope) {
if ($rootScope.user) {
return $rootScope.user;
} else {
return myApp._getUserAuth(AuthService, $rootScope);
}
}
};
$stateProvider
.state('login', {
url: '/login',
templateUrl: 'views/login.html',
controller: 'LoginCtrl'
})
.state('logout', {
url: '/logout',
templateUrl: 'views/login.html',
controller: 'LoginCtrl'
})
.state('home', {
url: '/home',
templateUrl: 'views/home.html',
controller: 'HomeCtrl',
resolve: resolveUserAuth
})
获取用户身份验证
myApp._getUserAuth = function (service, rootScope) {
return service.getRole().then(function () {
service.getUser().then(function (user) {
rootScope.user = user;
});
});
};
登录
service.login = function (data) {
var promise = $http.post('/auth/login', data).then(function (response) { // Success
$rootScope.user = response.data;
AssignedService.get({},
function(assigned) {
$rootScope.assigned = assigned;
$rootScope.showLogin = false;
}, function(error) {
if (console && console.error) {
console.error('Error getting assigned: ', error);
}
}
);
return response;
}, function() { // Error
$rootScope.showAlert('Unable to login, please try again', 'danger');
});
return promise;
};
关于javascript - AngularJS - 在应用程序启动之前处理路由,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/26059656/