如何避免/修复" Auth0Lock未定义"例外

时间:2016-12-04 10:05:45

标签: auth0 http-token-authentication angular2-jwt

我正在尝试使用Auth0进行社交登录,但我不断获得未定义引用的例外。

这是身份验证服务

import { Injectable }      from '@angular/core';
import { tokenNotExpired } from 'angular2-jwt';

// Avoid name not found warnings
declare var Auth0Lock: any;

@Injectable()
export class AuthService {
// Configure Auth0

lock = new Auth0Lock('I have set the ID correctly here', 'and the domain as well', {});

constructor() {
// Add callback for lock `authenticated` event
  this.lock.on("authenticated", (authResult) => {
  localStorage.setItem('id_token', authResult.idToken);
  });
}

public login() {
// Call the show method to display the widget.
  this.lock.show();
};

public authenticated() {
  // Check if there's an unexpired JWT
  // This searches for an item in localStorage with key == 'id_token'
  return tokenNotExpired();
};

public logout() {
   // Remove token from localStorage
    localStorage.removeItem('id_token');
  };
}

我注入了服务和配置的提供程序。一切都正确连线,但即使定义了它也不会找到Auth0Lock。 每当它达到lock = new Auth0Lock('ID', 'DOMAIN', {});时就会爆炸。

3 个答案:

答案 0 :(得分:6)

我将declare var Auth0Lock: any;替换为const Auth0Lock = require('auth0-lock').default;并解决了问题。

答案 1 :(得分:2)

接受的答案是好的。我确实得到了无法找到名称'require'错误。 而不是使用'declare const require',我这样导入:

import Auth0Lock from 'auth0-lock';

答案 2 :(得分:-2)

我需要添加到index.html

<script src="https://cdn.auth0.com/js/lock/10.8/lock.min.js"></script>

通过https://github.com/auth0/lock/issues/588