Angular2-jwt: Crash in Angular2 RC6

Created on 1 Sep 2016  路  18Comments  路  Source: auth0/angular2-jwt

Angular2 RC6 removes a lot of deprecated API.

Angular2-JWT uses the provide() method from @angular/core which has been removed.

Two approaches can be taken to fix this:

  • Frist is to convert the code to export an NgModule
  • Second is to convert the code to use the new Provider structure

/cc @chenkie

Most helpful comment

So there are already three PRs fixing rc.6. Are you guys trying to make @chenkie's phone vibrate enough so he wakes up or something? Should I send another PR as well? ;)

All 18 comments

I've submitted a PR that tries to fast-fix that call. I've also test-published a npm package with name and version @shadowmanu/[email protected].

@charsleysa @/mantainers can you check either the PR or if using the npm package for testing the fix works completely? My own application has a lot of bugs that I need to solve to assure the fix is enough for it to work (at least the provide errors SystemJS was throwing at me dissapeared).

After fixing some other stuff, seems like its working, at least with a custom provider. If of any interest, in our case, we define our provider like this (don't ask all the details of it since it was done by a team member) :

'use strict';

import { AuthHttp, AuthConfig } from 'angular2-jwt';
import { Http } from '@angular/http';

export let customHttpProvider: any = {
  provide: AuthHttp,
  useFactory: (http: Http) => {
    let config: AuthConfig = new AuthConfig({
      noJwtError: true,
      tokenName: 'token',
      tokenGetter: () => localStorage.getItem('token')
    });
    return new AuthHttp(config, http);
  },
  deps: [Http]
};

Anyway, the Authorization header gets sent with requests, no issues at my usage.

@ShadowManu @chenkie I've made changes using the second approach.
There were other changes required for RC6 such as upgrading to Typescript 2.0.2.
https://github.com/charsleysa/angular2-jwt

To use my repo until this repo is sorted out you can clone my repo and run npm install on it then copy the files over to your project's node_modules directory.

AFAIK, change to TS2 is not required. Why is it?

PS: Good to have an alternative repo, but I needed the npm approach since its easier to setup/replace with jspm in which our build is based for now.

@ShadowManu from what I know Angular themselves have moved to Typescript 2 and it is now in stable RC soon to be released as stable.
I don't think it's strictly required but recommended.

Also their offline compiler tool uses Typescript 2.

I would personally recommend it due to the upgrades in type checking and configuration.

Surely enough. Just that TS 2.0 was in beta (not crashing at all, I know), and its just recently moving to rc's and stable releases.

@ShadowManu I've corrected my comment above. TS2 is RC currently and will soon be stable.

TS2 is a compile time requirement. It won't affect consumers of the library (or it shouldn't).

So there are already three PRs fixing rc.6. Are you guys trying to make @chenkie's phone vibrate enough so he wakes up or something? Should I send another PR as well? ;)

Meh, I needed to fix stuff, whoever does it first (and better) and gets merged + released, makes my life happier ;)

@escardin the Angular2 Compiler CLI uses Typescript 2 for compiling consumer code from what I can see.

@ShadowManu I can't install your npm package:

'@shadowmanu/angular2-jwt' is not in the npm registry.

But it does work with:

"angular2-jwt": "shadowmanu/angular2-jwt#rc6-fix"

And my app appears to work again with RC6.

I unpublished the npm package since the crash was fixed in #145 and published in version 0.1.21. Looks like you're getting my github branch, but that's also no longer needed. Update and you'll be good.

PS: the main topic of this thread is fixed, issue should be closed.

@ShadowManu #145 has some logic which can lead to false positives during the isTokenExpired check. In my opinion I think this issue should still be open until it's resolved as the fix that was merged is inadequate.

I didn't checked that out (That's on the author and the merger), but look at the title of the issue. Its not a crash, its a bug for a different topic. Still believe the main topic is fixed.

Maybe not a direct answer or related to the question but might be worth noting:
I imported AuthHttp from angular2-jwt/angular2-jwt in my main app module to register as a provider but imported AuthHttp from angular2-jwt in my auth.service.ts. This caused a "no provider for AuthHttp" error. After hours of debugging I fixed this by importing any AuthHttp classes from the same angular2-jwt file. This was caused by WebStorm as I took over this project from another developer.

If anyone's interested, this is my working configuration for setting up the provider:

...
    {
        provide: AuthHttp,
        useFactory: (http) => {
            return new AuthHttp(new AuthConfig({
                headerName: 'Authorization',
                headerPrefix: 'Bearer',
                // tokenName: 'jwt_token',
                // tokenGetter: localStorage.getItem('jwt_token'),
                globalHeaders: [{'Content-Type': 'application/json'}],
                noJwtError: true,
                noTokenScheme: true
            }), http);
        },
        deps: [Http]
    },
...

@lewiswebber you have to use provideAuth from angular2-jwt package.

e.g.

        provideAuth({
            headerName: 'X-Access-Token',
            noTokenScheme: true,
            globalHeaders: [
                { 'Content-Type': 'application/json' }
            ]
        }),
Was this page helpful?
0 / 5 - 0 ratings