7

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

Filini
  • 2,109
  • 2
  • 22
  • 32
  • Are your URLs relative or absolute? because I only see `".../Locations ...`, not knowing what the first three dots stand for! And by the way, do you have an CORS plugin or something similar activated? – imans77 Jul 27 '18 at 15:02
  • The dots stand for "full absolute url of Bing Maps" and "other parameters that I'm passing". I just shortened the URLs to make the code more readable. I'll make the sample more clear – Filini Jul 27 '18 at 15:04
  • ...and no plugins are installed. same angular installation, same component, if I use Http it works, if I use HttpClient it sends the preflight OPTIONS – Filini Jul 27 '18 at 15:06
  • The plugin I'm talking about is on the browser, like your google chrome, because this functionality happens when that is active. – imans77 Jul 27 '18 at 15:08
  • no, no plugins on the browser. same client, same server (local, I'm in dev environment), I just change the service, and it changes the request to OPTIONS. I'm pretty sure I'm missing some configuration on the new HttpClient service... – Filini Jul 27 '18 at 15:21

1 Answers1

6

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');
Filini
  • 2,109
  • 2
  • 22
  • 32