1. ホーム
  2. angular

[解決済み] APIレスポンスからレスポンスヘッダを読み取る - Angular 5 + TypeScript

2023-01-09 08:35:35

質問

をトリガーしています。 HTTP リクエストを引き起こし、そこから有効なレスポンスを得ています。このレスポンスにはヘッダ X-Token があります。以下のコードでヘッダを読み取ろうとしていますが、結果としてnullが得られます。

this.currentlyExecuting.request = this.http.request(reqParams.type, reqParams.url, {
    body: reqParams.body,
    responseType: 'json',
    observe: 'response'
}).subscribe(
    (_response: any) => {
        // Also tried _response.headers.init();
        const header = _response.headers.get('X-Token');
        console.log(header);
        onComplete(_response.body);
     },
    _error => {
        onComplete({
            code: -1,
            message: Constants.WEBSERVICE_INTERNET_NOT_CONNNECTED
        });
    }
);

の応答は API のレスポンスを、Chrome inspectで確認すると、ヘッダが存在することがわかります。

どのように解決するのですか?

を公開しましたか? X-Token をサーバサイドから access-control-expose-headers すべてのヘッダがクライアント側からのアクセスを許可されているわけではないので、サーバ側から公開する必要があります。

また、フロントエンドでは、新しい HTTP モジュールを使って完全なレスポンスを得ることができます。 {observe: 'response'} のように

http
  .get<any>('url', {observe: 'response'})
  .subscribe(resp => {
    console.log(resp.headers.get('X-Token'));
  });