angular - Angular 5 アプリケーションを使用して CORS 対応 API から応答を取得できません

Question

Angular 5 アプリケーションから Watson 会話 API を呼び出したいのですが、そのために Angular HttpClient を使用しています。

以下はコード スニペットです。

import { HttpClient, HttpHeaders } from '@angular/common/http';
const url = 'https://gateway.watsonplatform.net/conversation/api?version=2017-05-26';
const username = 'my-username';
const password = 'secret';
const headers = new HttpHeaders({
  Authorization: 'Basic ' + btoa(`${username}:${password}`)
});
this.httpClient.get('https://gateway.watsonplatform.net/conversation/api?version=2017-05-26', { headers: headers })
  .subscribe(res => {
    console.log(res);
  });

API を呼び出して応答を返す必要がありますが、次のようなエラーが返されます。

Failed to load https://gateway.watsonplatform.net/conversation/api?version=2017-05-26: Request header field Authorization is not allowed by Access-Control-Allow-Headers in preflight response.

リクエストは、Postman および Node.js リクエスト パッケージでは完全に機能しますが、Angular 5 アプリでは機能しません。

cURL リクエストの例:

curl -u "{username}":"{password}" "https://gateway.watsonplatform.net/conversation/api/v1/{method}"

クロムにAllow-Control-Allow-Origin: *拡張機能を追加すると、上記のリクエストは正常に機能するため、Angular アプリの問題を理解できません。

前もって感謝します。