无法从后端响应获取“ Content-Disposition”

Question

I am trying to get the value from Content-Disposition from my backend response. but I am not able to get that at all..

here is my code :

public getQuoteImage(sharedQuote):Observable<any> {
    return this.http.post(environment.downloadSummarUrl, JSON.stringify(sharedQuote), { 
      headers: this.params.headers.validate,
      observe: "response",
      responseType : 'blob'
    });
  }

I am trying to get filename from Content-Disposition from the following:

downloadSummaryContent() {
    this.server.getQuoteImage(this.sharedQuote).subscribe((data) => {
      console.log( 'headers are', '\n', data, '\n',  data.headers.get('Content-Disposition') ); //but not getting the file name
      var url = window.URL.createObjectURL(data);
      var a = document.createElement('a');
      document.body.appendChild(a);
      a.setAttribute('style', 'display: none');
      a.href = url;
      a.download = 'quote.pdf';
      a.click();
      window.URL.revokeObjectURL(url);
      a.remove(); // remove the element
    });
  }

But not getting the value at all.

in the console i am getting:

{
  "headers": {
    "normalizedNames": {

    },
    "lazyUpdate": null,
    "lazyInit": null,
    "headers": {

    }
  },
  "status": 200,
  "statusText": "OK",
  "url": "https:XXXXXXservice/p/shipment/download/",
  "ok": true,
  "type": 4,
  "body": {

  }
}

Answer 1

According to MDN Access-Control-Expose-Headers documentation , CORS requests only allows javascript to access the following response headers:

• Cache-Control
• Content-Language
• Content-Type
• Expires
• Last-Modified
• Pragma

The server can allow access to other response headers using the Access-Control-Expose-Headers response, so, for Content-Disposition to be accessible to the client, you would need to issue

Access-Control-Expose-Headers: Content-Disposition

header in the response