我在使用Auth0进行身份验证时遇到问题。
我在authManager上验证未定义。
authManager被注入authService,并在app“auth0.lock”中添加,“angular-jwt”被添加到模块中。
App.ts(运行方法):
app.run(["$rootScope", "authManager", "AuthService",
function($rootScope, authManager, authService) {
// Put the authService on $rootScope so its methods
// can be accessed from the nav bar
$rootScope.authService = authService;
// Register the authentication listener that is
// set up in auth.service.js
authService.registerAuthenticationListener();
// Use the authManager from angular-jwt to check for
// the user's authentication state when the page is
// refreshed and maintain authentication
authManager.checkAuthOnRefresh();
// Listen for 401 unauthorized requests and redirect
// the user to the login page
authManager.redirectWhenUnauthenticated();
}]);
AuthService.ts:
class AuthService {
public userProfile: any;
constructor(private $rootScope, private lock, private authManager) {
this.userProfile = JSON.parse(localStorage.getItem("profile")) || {};
}
public login() {
this.lock.show();
}
// Logging out just requires removing the user's
// id_token and profile
public logout() {
localStorage.removeItem("id_token");
localStorage.removeItem("profile");
this.authManager.unauthenticate();
this.userProfile = {};
}
// Set up the logic for when a user authenticates
// This method is called from app.run.js
public registerAuthenticationListener(authManager) {
//const self = AuthService._instance;
this.lock.on("authenticated", function(authResult) {
localStorage.setItem("id_token", authResult.idToken);
authManager.authenticate(); // <-- here is the error
this.lock.getProfile(authResult.idToken, function(error, profile) {
if (error) {
console.log(error);
}
localStorage.setItem("profile", JSON.stringify(profile));
this.$rootScope.$broadcast("userProfileSet", profile);
});
});
}
}
AuthService.$inject = ["$rootScope", "lock", "authManager"];
export default AuthService;
我在服务中添加了一个静态工厂方法,并且authManager没有未定义,但是它没有在authService构造函数中设置。
以下是代码:
public static Factory($rootScope, lock, authManager) {
AuthService._instance = new AuthService($rootScope, lock, authManager);
console.log("authManager: " + authManager.authenticate);
return AuthService._instance;
}
答案 0 :(得分:1)
使用TypeScript和ES6时的解决方案:
步骤1: app.ts
.service("AuthService", AuthService.Factory)
步骤2: authService
class AuthService {
private static _instance: AuthService;
public userProfile: any;
private _authManager: any;
private _lock: any;
private _$rootScope: any;
public static Factory($rootScope, lock, authManager) {
AuthService._instance = new AuthService($rootScope, lock, authManager);
return AuthService._instance;
}
constructor(private $rootScope, private lock, private authManager) {
this._authManager = authManager;
this._lock = lock;
this._$rootScope = $rootScope;
this.userProfile = JSON.parse(localStorage.getItem("profile")) || {};
}
public login() {
this.lock.show();
}
// Logging out just requires removing the user's
// id_token and profile
public logout() {
localStorage.removeItem("id_token");
localStorage.removeItem("profile");
this.authManager.unauthenticate();
this.userProfile = {};
}
// Set up the logic for when a user authenticates
// This method is called from app.run.js
public registerAuthenticationListener() {
const self = AuthService._instance;
this.lock.on("authenticated", function (authResult) {
localStorage.setItem("id_token", authResult.idToken);
self._authManager.authenticate();
self._lock.getProfile(authResult.idToken, function (error, profile) {
if (error) {
console.log(error);
}
localStorage.setItem("profile", JSON.stringify(profile));
self._$rootScope.$broadcast("userProfileSet", profile);
});
});
}
}
AuthService.$inject = ["$rootScope", "lock", "authManager"];
export default AuthService;
我在工厂中创建一个新实例,然后通过获取实例在方法中使用它。 const self = AuthService._instance
。