angular - Angular2, Auth0 připojující se k Fitbit API, JWT potřebuje 3 části
Momentálně pracuji s Angular2, snažím se připojit k fitbit API pomocí auth0. Používám Angular2-JWT a Lock.js dodaný s Auth0. Zatím funguje login a čtení jednoduchých profilových dat bez problémů pomocí id_token generovaného Lock.js, ale ve chvíli, kdy bych chtěl stáhnout informace, jako jsou aktivity, žádost na API vyvolá chybu.
Ale pak jsem si všiml, že kromě toho, Lock.js také poskytuje něco jako Access_token. Vždycky jsem si myslel, že to je ten správný, který se má použít.
Token id_token/access_token získávám následujícím způsobem.
@Injectable()
export class Auth {
// Configure Auth0
lock = new Auth0Lock('[CENSORED]', '[CENSORED],{});
constructor() {
// Add callback for lock `authenticated` event
this.lock.on("authenticated", (authResult:any) => {
this.lock.getProfile(authResult.idToken, function(error:any, profile:any){
if(error){
throw new Error(error);
}
localStorage.setItem('id_token', authResult.idToken);
localStorage.setItem('access_token', authResult.accessToken);
localStorage.setItem('profile', JSON.stringify(profile));
console.log('ID_token: ' + authResult.idToken);
console.log('Access_token: ' + authResult.accessToken);
});
});
}
Nyní prosím vezměte na vědomí, že získávám Id_token a Access_token, také se snažím postupovat podle Implicit Grant flow, a pokud to správně chápu, mělo by to znamenat, že musím poslat autorizační token výměnou za přístupový token? Ale co bych chtěl dosáhnout, nebo alespoň zjistit, je, zda Access_token, který získávám pomocí Lock.js, je ten, který je potřeba pro komunikaci s Fitbit API? Nebo opravdu potřebuji id_token?
Dokumentace o tom opravdu není jasná. Takže pokračujme, budeme i nadále používat tento Access_token, pokračuji v používání angular2-JWT, aby mi pomohl odeslat AuthHttp do Fitbit API. Moje služba pro získávání aktivit vedoucí k tomuto vypadá následovně:
@Injectable()
export class FetchActivityService {
constructor (
public AuthHttp: AuthHttp
) {}
activity:any;
jwtHelper: JwtHelper = new JwtHelper();
useJwtHelper() {
var token = localStorage.getItem('id_token');
console.log(
this.jwtHelper.decodeToken(token),
this.jwtHelper.getTokenExpirationDate(token),
this.jwtHelper.isTokenExpired(token)
);
}
GetActivity() {
this.AuthHttp.get('https://api.fitbit.com/1/activities.json')
.subscribe(data => this.activity = data, error => console.log(error));
}
}
Tak odvážně, relevantní část kódu jen nasazuje Angular2-JWTs AuthHttp, aby správně přidal autorizační hlavičku do mého API požadavku. Takže stále v tomto případě Access_token, takže moje AuthHttp továrna vypadá takto
export function authHttpServiceFactory(http: Http, options: RequestOptions) {
return new AuthHttp(new AuthConfig({
tokenName: 'access_token',
tokenGetter: (() => localStorage.getItem('access_token'))
}), http, options);
}
Jen aby bylo vidět, mohu vám ukázat, že to vážu na Access_token vygenerovaný přímo z Lock.js. Takže jakmile se pokusím spustit GetActivity() jak je uvedeno výše, dostanu následující chybu:
Error: JWT must have 3 parts
To je celé chybové hlášení, nechápu to, Angular2 JWT by měl používat Access_token k vytvoření platného JWT a odeslat ho do API, tak co jsem udělal špatně? Mohu také říci, že Access_token, když je vytištěn v konzoli, je poměrně krátký řetězec, zatímco Id_token je už JWT.
Teď si prosím představte všechny výše uvedené kroky, ale access_token nahrazený Id_tokenem, to dává následující chybu. Červený text zobrazuje dlouhý JWT, jen jsem ho sem nedal, protože je velmi dlouhý.
"errorType":"invalid_token","message":"Access token invalid:[JWT]
V tomhle jsem naprosto ztracený.