Angular2-jwt: Using tokenNotExpired on Ionic 2: ORIGINAL EXCEPTION: token.split is not a function

[karlpatrickespiritu]

When using tokenNotExpired in Ionic 2 (ionic-angular 3.10.8), I'm getting a token.split is not a function error everytime. Did I miss something? I'm just following the straightforward example on the docs.

Simplified copy of my code:

import { Storage } from '@ionic/storage';
import { tokenNotExpired } from 'angular2-jwt';
.....
@Component({
    selector: 'login',
    templateUrl: 'login.component.html',
    providers: [
        ... 
        Storage
    ]
})
export class LoginComponent {
....
    constructor(private storage: Storage) {
        // this throws: ORIGINAL EXCEPTION: token.split is not a function
        console.log(
           tokenNotExpired(null, this.storage.get('id_token'))
         );
    }
}

[makurtu]

I have the same issue. This issue happens when you send to the tokenNotExpired a Promise instead of String. The Storage package of Ionic2 RC0 returns a Promise, not a String, so the only way to handle it is working with Promises:

this.storage.get('id_token').then(token => {
    console.log(tokenNotExpired(null, token)); // Returns true/false
});

The next step is return this True/False result to *ngIf="auth.authenticated()", but I didn't found how to do it, maybe someone can help us.

P.S.: I just come to this repo to publish this same issue, so I subscribe to this thread.

[karlpatrickespiritu]

That definitely removed the error @MateuLlull. The docs must not be updated.

This should also work:

tokenNotExpired('id_token');

The only thing left for me is that even though I already set the token in the local storage by doing:

this.storage.set('id_token', token);

the tokenNotExpired always returns false.

[makurtu]

The only thing left for me is that even though I already set the token in the local storage by doing:
this.storage.set('id_token', token);
the tokenNotExpired always returns false.

This issue maybe is because the _angular2-jwt_ works with localStorage and now the _Ionic2 Storage_ works in a different way.

See the docs (https://github.com/auth0/angular2-jwt#configuation-for-ionic-2) and look for tokenGetter config. This must work, but no way for me, the only code that works is the one that I shared with you in the first post. My problem still the same, return an _async_ (async because it is a promise-related return) value to the ngIf directive.

[chenkie]

One thing you could do is get the token fromstorage and save it in the app's state when it starts up. Then you can pass this to tokenNotExpired. There's more token management in the auth service using this method, but it works: https://github.com/auth0-samples/auth0-ionic2-samples/blob/master/01-Login/src/services/auth/auth.service.ts

We'll be refactoring the lib and one thing we can likely do is allow tokenNotExpired to handle promises like how the tokenGetter has support for them.

[gfviegas]

Please see #185

[makurtu]

Thank's @chenkie, this is the shortest way to handle it. :+1:

[karlpatrickespiritu]

Thank you @chenkie. That worked.

Well, to sum it all up. When using tokenNotExpired in Ionic, we should pass the token string in the second parameter rather than passing a promise. See @mateullull's comment.

Regarding #85, It would be great if there would be a way to select which storage to choose from. I had mine working by manually setting the token in the localstorage.

Thanks guys!