Angular 2从文件下载获取文件名

Question

我似乎无法显示内容处置标头。我只能看到Content-Type。这是我的回答。

public openAttachment(id: number) {
this.http
  .get(`${this.startupService.baseUrl}company/${this.company.companyID}/attachment/${id}`,
     {responseType: 'blob', observe: 'response'})
  .subscribe(data => {
    console.log(data);

    const contentDis = data.headers.get('content-disposition');
    console.log(contentDis);

    const contentType = data.headers.get('content-type');
    console.log(contentType);
  });
}    

这是我的控制台日志的副本：

以及回复：

Answer 1

这似乎不是你的代码的错。

如果后端未正确设置“Access-Control-Expose-Header”，则浏览器客户端代码无法访问它。

因此，请检查并在后端代码中设置Access-Control-Expose-Headers(‘Content-Disposition’)。

在这种情况下，

https://jaketrent.com/post/expose-http-headers-in-cors/链接可能会有所帮助。

Answer 2

在service.ts

  bulkValidations(id){
    let url = `exportForValidation/${id}`;
    return this.http.get(url, { responseType: ResponseContentType.Blob })
      .map((res: Response) => res)
      .catch((error: Response | any) => {
        return Observable.throw(error);
      });
  }

在.ts文件中

  this.employeeService.bulkValidations(this.id).subscribe(
        (data: any) => {      
          let filename = data.headers.get('content-disposition').split(';')[1].split('=')[1].replace(/\"/g, '')
        }));

这一行帮助我从响应头中获取文件名。

let filename = data.headers.get('content-disposition').split(';')[1].split('=')[1].replace(/\"/g, '')