Angular HttpClient issue when calling Bing Maps Locations REST methods

Question

I have an existing call to Bing Maps made with Angular 4 Http service, that is working correctly:

this.http.get("{absolute URL of Bing Maps REST Locations, with options and key}")

I'm trying to change the call to use the HttpClient service introduced in Angular 4.3, but when trying the same code:

this.httpClient.get("{absolute URL of Bing Maps REST Locations, with options and key}")

then the request is sent with the preflight OPTIONS request, and bing maps obviously refuses it.

I've tried to observe the request instead of the body, requesting a text response, and force the Accept header to text, but had no success.

Headers of the Http request (working):

Accept: application/json, text/plain, */*
Origin: http://localhost:4200
Referer: http://localhost:4200/
User-Agent: Mozilla/5.0 (Windows NT 6.1; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/67.0.3396.99 Safari/537.36

Headers of the HttpClient request (not working):

Access-Control-Request-Headers: authorization
Access-Control-Request-Method: GET
Origin: http://localhost:4200
User-Agent: Mozilla/5.0 (Windows NT 6.1; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/67.0.3396.99 Safari/537.36

Any idea about why the HttpClient request is so different than the Http request?how do I force the HttpClient to skip the preflight OPTIONS request? Am I missing something?

Thanks in advance for any help

Answer 1

I finally found a solution (although I haven't found out why HttpClient behaves so differently from Http, when building a request with the default settings).

The Bing Maps V8 REST API can also be called with a jsonp call parameter:

 let url = '...base url and query params...&key={MyBingMapsKey}&jsonp=JSONP_CALLBACK';
 this.httpClient.jsonp(url, 'JSONP_CALLBACK');