我试图从https://github.com/keycloak/keycloak/tree/master/examples/demo-template/angular-product-app创建一个改进的登录示例 似乎更适合初学者的东西。
无论如何,我在提供者和配置中添加了所有初始配置,因为我觉得这是一种更好的角度方法。 然后我尝试调用keycloak.init(),这是一个初始化变量的函数,根据你传递的参数,你可以看到它是否已经被记录。 问题是当记录时令牌需要一段时间,我认为这是正常的。
所以我添加了一个$ rootScope.watch(loggedIn),所以当init()成功时,$ rootScope.loggedIn设置为true,如果它改变了。
我在$ rootScope中添加了$ scope。$ apply。$ watch。 由于代码是现在,它的工作原理,我得到一个$ diggest问题,因为$ scope。$ apply但它的工作原理。我知道这真是个错误。
所以我正在寻找解决方案。棱角分明,我真的很陌生。我只能通过以下方式思考
1)可以在没有$ rootScope的情况下工作,我认为如果它没有$ rootScope,它将是一个更好的代码,但我不知道如何。也许使用promises,$ q等。 2)使用$ timeout,我仍在阅读。
我正在寻找更优雅的解决方案。
var app = angular.module('myApp', []);
app.controller('PageController', function($rootScope,$scope, $http ,keycloakLauncher) {
$scope.loggedIn = keycloakLauncher.loggedIn;
$scope.user = function(){
console.log("keycloak ", keycloakLauncher.keycloak);
console.log("loggedin ", keycloakLauncher.loggedIn);
if($scope.loggedIn){
/*if(keycloakLauncher.keycloak.idTokenParsed == undefined){
return "Anonymous"
}*/
return keycloakLauncher.keycloak.idTokenParsed.email
}
return "Anonymous";
};
$scope.products = [];
$scope.reloadData = function() {
$http.get("https://localhost:8443/unika/usuarios").success(function(data) {
$scope.products = angular.fromJson(data);
});
};
$scope.logout = function(){
console.log('*** LOGOUT');
keycloakLauncher.loggedIn = false;
keycloakLauncher.keycloak = null;
window.location = keycloakLauncher.logoutUrl;
};
$scope.login = function () {
console.log('*** LOGIN');
keycloakLauncher.keycloak.login();
};
$rootScope.$watch('loggedIn', function(){
$scope.loggedIn = keycloakLauncher.loggedIn;
$scope.user();
$scope.$apply();
});
});
app.provider('keycloakLauncher', function keycloakLauncherProvider() {
this.keycloak = {};
this.loggedIn = false;
this.logoutUrl = "/";
this.$get = function () {
var keycloak = this.keycloak;
var loggedIn = this.loggedIn;
//var logoutUrl
return {
keycloak: keycloak,
loggedIn: loggedIn,
logoutUrl: this.logoutUrl
};
};
});
app.factory('authInterceptor', function($q, keycloakLauncher) {
return {
request: function (config) {
var deferred = $q.defer();
var keycloak = keycloakLauncher.keycloak;
console.log("authint", keycloakLauncher.loggedIn);
if (keycloak.token) {
keycloak.updateToken(5).success(function() {
config.headers = config.headers || {};
config.headers.Authorization = 'Bearer ' + keycloak.token;
deferred.resolve(config);
}).error(function() {
deferred.reject('Failed to refresh token');
});
}
return deferred.promise;
}
};
});
app.factory('errorInterceptor', function($q) {
return function(promise) {
return promise.then(function(response) {
return response;
}, function(response) {
if (response.status == 401) {
console.log('session timeout?');
logout();
} else if (response.status == 403) {
alert("Forbidden");
} else if (response.status == 404) {
alert("Not found");
} else if (response.status) {
if (response.data && response.data.errorMessage) {
alert(response.data.errorMessage);
} else {
alert("An unexpected server error has occurred");
}
}
return $q.reject(response);
});
};
});
app.config(function($httpProvider, keycloakLauncherProvider) {
keycloakLauncherProvider.keycloak = new Keycloak('WEB-INF/keycloak.json');
keycloakLauncherProvider.logoutUrl = "https://localhost:8443/auth/realms/unika/tokens/logout?redirect_uri=http://unika.localdomain/index2.html";
$httpProvider.interceptors.push('errorInterceptor');
$httpProvider.interceptors.push('authInterceptor');
});
app.run(['keycloakLauncher','$rootScope',function(keycloakLauncher,$rootScope) {
console.log("runner")
$rootScope.loggedIn = false;
keycloakLauncher.keycloak.init({ onLoad: 'check-sso' }).success(function () {
console.log("entro");
keycloakLauncher.loggedIn = keycloakLauncher.keycloak.authenticated;
console.log("login", keycloakLauncher.loggedIn);
$rootScope.loggedIn = true;
}).error(function () {
window.location.reload();
});
}]);