Angular HttpClient在调用Bing Maps Locations REST方法时出现问题

Question

我有一个使用Angular 4 Http服务调用Bing地图的现有代码，目前它可以正常工作：

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

我正在尝试使用Angular 4.3引入的HttpClient服务更改调用方式，但是当我尝试相同的代码时：

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

然后使用预检OPTIONS请求发送请求，但必应地图显然会拒绝它。

我尝试观察请求而不是正文，请求文本响应，并强制接受标头为文本，但没有成功。

HTTP请求的标头（有效）：

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

HttpClient请求的标题（不工作）：

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

任何关于为什么HttpClient请求与Http请求如此不同的想法？我该如何强制HttpClient跳过预检OPTIONS请求？我有遗漏吗？

提前感谢您的任何帮助。

- Filini

---

你的URL是相对路径还是绝对路径？因为我只看到".../Locations ...，不知道前三个点代表什么！顺便问一下，你有CORS插件或类似的东西激活了吗？ - imans77

这些点代表“Bing Maps的完整绝对URL”和“我正在传递的其他参数”。我只是缩短了URL以使代码更易读。我将使示例更清晰。 - Filini

...并且没有安装任何插件。相同的Angular安装，相同的组件，如果我使用Http它可以工作，如果我使用HttpClient它会发送预检OPTIONS请求。 - Filini

我所说的插件是在浏览器上的，就像你的谷歌浏览器一样，因为这个功能只有在它处于活动状态时才会发生。 - imans77

没有，浏览器上没有插件。同一客户端、同一服务器（本地，我在开发环境中），我只是改变了服务，它就会将请求更改为 OPTIONS。我很确定我在新的HttpClient服务上缺少一些配置... - Filini

Answer 1

我终于找到了一个解决方案（尽管我还没有弄清楚为什么使用默认设置构建请求时HttpClient的行为与Http如此不同）。

Bing Maps V8 REST API也可以通过调用jsonp调用参数进行调用：

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

- Filini