angular - Angular2, Auth0 kobler til Fitbit API, JWT trenger 3 deler


Jeg jobber for øyeblikket med Angular2, og jeg prøver å koble til Fitbit API med auth0. Jeg bruker Angular2-JWT og Lock.js levert av Auth0. Så langt fungerer innlogging og lesing av enkle profildata feilfritt ved bruk av Lock.js genererte id_token, men i det øyeblikket jeg ønsker å hente informasjon som aktiviteter, gir forespørselen til API-et en feil.

Men så la jeg merke til at i tillegg til dette, gir Lock.js også noe som Access_token. Jeg har alltid trodd at dette er den riktige å bruke.

Jeg henter id_token/access_token på følgende måte.

@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);

      });
    });
  }

Vennligst merk at jeg henter en Id_token og en Access_token. Jeg prøver også å følge Implicit Grant-flowen, og hvis jeg tolker det riktig, betyr dette at jeg må sende autorisasjonstokenet for å få en access token? Men det jeg ønsker å finne ut av, er om Access_token jeg henter ved bruk av Lock.js er den som trengs for å kommunisere med Fitbit API, eller om jeg faktisk trenger id_token?

Dokumentasjonen er virkelig ikke klar om dette. Så videre, la oss fortsette å bruke denne Access_token, jeg fortsetter med å bruke angular2-JWT for å hjelpe meg med å sende en AuthHttp til Fitbit API. Min aktivitetshentingsservice frem mot dette ser slik ut:

@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));
  }


}

Så dristig, relevant del av koden er bare å bruke Angular2-JWTs AuthHttp for å legge til autorisasjonsheaderen riktig til API-forespørselen min. Så fortsatt i dette tilfellet over Access_token, ser AuthHttp-fabrikken min slik ut

export function authHttpServiceFactory(http: Http, options: RequestOptions) {
  return new AuthHttp(new AuthConfig({
    tokenName: 'access_token',
    tokenGetter: (() => localStorage.getItem('access_token'))
     }), http, options);
}

Bare for å vise at du kan se at jeg binder det til Access_token generert direkte fra Lock.js. Så snart jeg prøver å kjøre GetActivity() som vist ovenfor, får jeg følgende feil:

Error: JWT must have 3 parts

Det er hele feilmeldingen, jeg forstår det ikke, Angular2 JWT skal bruke Access_token for å generere en gyldig JWT og sende denne til API-en, så hva gjorde jeg galt? Kan jeg også si at Access_token, når den skrives ut i konsollen, er en ganske kort streng, mens Id_token allerede er en JWT.

Vennligst forestill deg nå alle trinnene ovenfor, men med access_token erstattet med Id_token, det gir følgende feil. Den røde teksten viser en lang JWT, jeg skrev den bare ikke inn her fordi den er veldig lang.

"errorType":"invalid_token","message":"Access token invalid:[JWT]

Jeg er helt fortapt i dette.