我得到authManager是未定义的

时间:2016-09-10 17:10:05

标签: typescript ecmascript-6 auth0 angularjs-1.5

我在使用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;  

}

1 个答案:

答案 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