How do I use Here Geocoding and search api from angular service with API key

Question

I'm new to Angular, I want to use Here Geocoding api in my angular service, I appended my apiKey to the httpParams but it didn't work. Here is my code in the service:

    let params = new HttpParams();
    params = params.append('at', `${coordinates.latitude},${coordinates.longitude}`);
    params = params.append('q', query);
    params = params.append('limit', limit);
    params = params.append('apiKey', environment.apiMapRest);
    return this.httpClient.get('https://discover.search.hereapi.com/v1/discover', {params});

Here is the error:

Access to XMLHttpRequest '
from origin 'http://localhost:4200' has been blocked by CORS policy: 
No 'Access-Control-Allow-Origin' header is present on the requested resource.

I can access it directly in my browser and postman btw.

Milan Tenk · Accepted Answer · 2020-04-29 17:43:48Z

1

This is because from the browser a cross origin call was made. Here can be found the details about the cross origin policy. There hereapi also documents this case here.

I would put the hereapi request logic on the backend of the Angular application. This way the Angular app would only communicate with his own backend, and would not do any cross origin calls. On the other hand if the hereapi calls are on backend side, the apikey is not exposed. (If the hereapi is called directly from Angular side, the apikey can be taken easily.)

answered Apr 29, 2020 at 17:43

Milan Tenk

2,7681 gold badge20 silver badges34 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

How do I use Here Geocoding and search api from angular service with API key

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related