Service for obtaining exchange rates - why does not work?

Question

Angular

Good evening. I'm trying to write a service for getting exchange rates. I use the following portal - https://currencylayer.com/ .
According to the manual, I get the following code:

getCurrensy(): Observable<any> {
        const url = 'http://apilayer.net/api/live?access_key=<b>mykey</b>&currencies=EUR,RUB&source=USD&format=1'
        return this.http.jsonp(url, '')
            .pipe(
                map((response: Response) => response.json())
            )
    }

After, in the component module I try to call this service:

this.organizationService.getCurrensy().subscribe(
        curr => {
            console.log(curr)
      }
    )

and in the console I get:

Uncaught SyntaxError: Unexpected token :

In the manual on this portal, I found a description for working with JSONP, but I didn’t really understand it. What am I doing wrong? Thank you.

Answer 1

Where is your accsess_key? It says to you that the token is not good

Answer 2

NO, I just replaced my key for the forum, believe me it is. In the statistics of my personal account, it is noted that the request was. In the Google "Developer Tool" in the Network tab, I get all the necessary data, but there is an error in the component itself.
I think I understand what's going on. My project uses jwt-token to protect my "internal" routes and apparently the "external" request is not registered with me and swears at an unknown token. Could this be the issue?
I use it like this:
How can I add protection to the outer request?