Auth0には、無料アカウントのデータベースが付属しています。ログイン登録ウィジェットをアプリケーションに追加すると、ユーザーがサインアップすると、auth0アカウントのデータベースに追加されます。
あなたは私が何のプロセスhere
に関する情報を見ることができるがauth0ウィジェットでユーザーを認証です。これにより、auth0は暗号化とセキュリティーを処理できます。その後、ユーザーがログインすると、応答にプロファイルが要求されます。通常、これは私に電子メールアドレスのような少なくとも基本的な情報を与えます。電子メールアドレスを固有のキーとして使用して自分のデータベースを作成し、ログイン時に正しいデータをユーザーに提供できるようにします。
これは、ウィジェットを使用し、応答でユーザーのプロファイルを要求してローカルストレージに格納するauth0サービスの例です。
import { Injectable } from '@angular/core';
import { tokenNotExpired, JwtHelper } from 'angular2-jwt';
import { Router } from '@angular/router';
import { myConfig } from './auth.config';
declare var Auth0Lock: any;
var options = {
theme: {
logo: '/img/logo.png',
primaryColor: '#779476'
},
languageDictionary: {
emailInputPlaceholder: "[email protected]",
title: "Login or SignUp"
},
};
@Injectable()
export class Auth {
lock = new Auth0Lock(myConfig.clientID, myConfig.domain, options, {});
userProfile: Object;
constructor(private router: Router) {
this.userProfile = JSON.parse(localStorage.getItem('profile'));
this.lock.on('authenticated', (authResult: any) => {
localStorage.setItem('access_token', authResult.idToken);
this.lock.getProfile(authResult.idToken, (error: any, profile: any) => {
if (error) {
console.log(error);
return;
}
localStorage.setItem('profile', JSON.stringify(profile));
this.userProfile = profile;
this.router.navigateByUrl('/overview');
});
this.lock.hide();
});
}
public login() {
this.lock.show();
}
private get accessToken(): string {
return localStorage.getItem('access_token');
}
public authenticated(): boolean {
try {
var jwtHelper: JwtHelper = new JwtHelper();
var token = this.accessToken;
if (jwtHelper.isTokenExpired(token))
return false;
return true;
}
catch (err) {
return false;
}
}
public logout() {
localStorage.removeItem('profile');
localStorage.removeItem('access_token');
this.userProfile = undefined;
this.router.navigateByUrl('/home');
};
}