Angular2-jwt: 1.0.0-beta.10: Failed to construct 'URL': Invalid URL

[ghost]

with beta 9 everything was working fine but with beta10 i get now:
Failed to construct 'URL': Invalid URL
url example:
/api/v1/system/mode (same server)

JwtModule.forRoot({
      config: {
        tokenGetter: tokenGetter,
        whitelistedDomains: ['localhost']
      }
    }),

export function tokenGetter() {
  return localStorage.getItem(Configuration.AUTH_TOKEN_ID);
}

This issue is caused by the changes on src/jwt.interceptor.ts in pull request #438
const requestUrl = new URL(request.url);
will not accept relative urls. It has to be new URL(relative, base)or new URL(full-url)

[laran]

+1

[jameskentTX]

I have the same error. Beta 9 works.

[miguelcaravantes]

same issue

[cmcclellen]

Any word on this? Did you find any work-arounds @DaveXCS ? I have an interceptor that makes it a full url, but unfortunately it looks like the jwt interceptor is first in the chain and i don't seem to be able to change it so my interceptor is first.

[fititrick]

same issue

[ghost]

The current workaround is to use full url or use beta9.
The author of the pull request has the opinion that a crashing or non working application is better than an unsafe application.
I would personally prefer to make it safe and working but it seems they have different understanding about that :-)

[Mike1707]

@DaveXCS Unfortunately, I don't get it working. Maybe it's an issue because I'm using the Ionic Framework (3.9.2)? At the moment, I'm doing this:

whitelistedDomains: [new URL('http://localhost:1337'), new URL('https://api.myurl.com')]

But the same Error: TypeError: Failed to construct 'URL': Invalid URL

With beta.9 it was:

whitelistedDomains: ['localhost:1337', 'api.myurl.com']

[ghost]

The problem is not the url of the whitlisted domains. The problem is if you send any request with the angular http service e.g.:
this.http.get('/api/values', httpOptions)
will not work but
this.http.get('http://localhost:3030/app/api/values', httpOptions)
will work.
Beta9 had a try catch around const requestUrl = new URL(request.url);
So in the case of a relative url the error 'Invalid URL' was catched with an empty catch block.
In Beta10 they removed the try/catch and now relative url requests are no longer working (which is the default on most of the application).
Beta9:

 isWhitelistedDomain(request: HttpRequest<any>): boolean {
     let requestUrl: URL;
     try {
       requestUrl = new URL(request.url);
       return (
         this.whitelistedDomains.findIndex(
           domain =>
             typeof domain === 'string'
               ? domain === requestUrl.host
               : domain instanceof RegExp ? domain.test(requestUrl.host) : false
         ) > -1
       );
     } catch (err) {
       // if we're here, the request is made
       // to the same domain as the Angular app
       // so it's safe to proceed!!!
       return true;
     }

The second options is not to use this http interceptor at all and manually add the token in every request (add "Authentication: Bearer token" to the header in the http options)

[Mike1707]

That's very interesting since I'm totally sure I just use full URLs in all of my requests.

[mjb1632]

At the point the interceptors are called, how do you ever know the full path?
I want an application to be able to work on dev, test, prod servers and domain names might change so I never want any specific domain hard coded. I suppose I need to make a non-intercepted request first to get the baseUrl of the deployment and then use that?

[ghost]

you could do here sth like -> if request.url starts with '/' (or regex expression) and whitlisted domains contain 'localhost' -> return true so you don't need the full url.

btw you can write your own interceptor instead of the angular-jwt interceptor sth like that:

@Injectable()
export class TokenInterceptor implements HttpInterceptor {
  constructor(public auth: AuthService) {}
  intercept(request: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {

    request = request.clone({
      setHeaders: {
        Authorization: `Bearer ${this.auth.getToken()}`
      }
    });
    return next.handle(request);
  }
}

[brian428]

There are also cases where it's impossible to know the full URL in advance (the final prod host name is unknown at development time). I think the library has to allow for relative URLs.

[Sambaja]

Could we just replace the creation of the url by this :

var requestUrl = new URL(request.url, /^https?:\/\//i.test(request.url) ? undefined : window.location.href)

in the mean time, open the file in the node_module jwt.interceptor.js and replace the faulty line by what i proposed and it should work.

[anibalsanchez]

Same issue here.

Sample URL: "./assets/i18n/en.json"

[dushkostanoeski]

Why hasn't this been addressed before the final release?

[noumaans]

@Sambaja we are using this library under {N}ativeScript on iOS / Android. I'd prefer the fix in #489 if possible.

[red-ab]

Hi everybody,

I was dealing with exactly the same issue after updating to 1.0.0, even if I was already using absolute URLs in all of my requests. After investigating, I realized that the problem was coming from the custom factory of the translation package TranslateModule.

export function TranslateFactory(http: HttpClient): TranslateHttpLoader {

    return new TranslateHttpLoader(http, './assets/i18n/', '.json');
}

And this is how I fixed it.

export function TranslateFactory(http: HttpClient): TranslateHttpLoader {

    return new TranslateHttpLoader(http, location.origin + '/assets/i18n/', '.json');
}

Hope this will be helpful!

[jualoppaz]

That's right. It's a very good solution by the moment. Thank you so much!!

[elfrasco]

Same issue :(

Meanwhile I had to do a downgrade to 1.0.0-beta.9 version.

[ydemir]

Same issue :(

Meanwhile I had to do a downgrade to 1.0.0-beta.9 version.

[anibalsanchez]

The workaround with location.origin works perfectly fine... Still, it should only whitelist URIs with a domain, and not throw errors with any other URIs.

[aaronte]

Same problem with release 1.0.0 :(

[liofal]

Same problem with release 1.0.0

[valera33]

Can confirm, same problem with release 1.0.0 :(
plz fix it, reverting to beta 9.

[kadavre]

Same issue here, reverting to beta 9 :/

[thir13en]

Same issue, fallback to beta.9 did work as a charm

[aamir1995]

This should be fixed with the release of 1.1.0.

[anibalsanchez]

Confirmed. Solved with 1.1.0.

[thir13en]

Thanks! Will upvote as soon as I sign in GitHub!

Il 16 mar 2018 5:59 PM, "Anibal Sanchez" [e-mail] ha
scritto:

Confirmed. Solved with 1.1.0.

—
You are receiving this because you commented.
Reply to this email directly, view it on GitHub
https://github.com/auth0/angular2-jwt/issues/477#issuecomment-373778496,
or mute the thread
https://github.com/notifications/unsubscribe-auth/AVOr2eHu9OgY2UhHswZZ8cvUdUnouIJPks5te-9qgaJpZM4RybZh
.

[stale[bot]]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. If you have not received a response for our team (apologies for the delay) and this is still a blocker, please reply with additional information or just a ping. Thank you for your contribution! 🙇‍♂️