Question

我无法找到，如何从角度2文档中的内容配置中读取文件名。有人可以指导从角度为2 content headers

的服务器读取标题

Answer 1

您可以在此处尝试此类代码。

注意：请勿使用地图

this.http.post(URL, DATA)
  .subscribe((res) => {
     var headers = res.headers;
     console.log(headers); //<--- Check log for content disposition
     var contentDisposition= headers.get('content-disposition');
});

Answer 2

对于那些抱怨最佳解决方案不起作用且只有内容类型位于标题中的人，您需要设置“访问控制 - 展示 - 标题”＆＃39;内容配置＆＃39;在服务器端。我使用的是asp.net核心，然后我必须执行以下操作。

app.UseCors(builder =>
                builder.WithOrigins(originsAllowed.ToArray())
                    .AllowAnyMethod()
                    .AllowAnyHeader()
                    .WithExposedHeaders("Content-Disposition")

Answer 3

使用新的Angular Http，可以在服务代码中尝试以下操作。

  downloadLink(): Observable<HttpResponse<Blob>> {
    return this.http.get<Blob>(this.someURL, {
      observe: 'response',
      responseType: 'blob' as 'json'
    });
  }

并使用上面的

 this.someService
  .downloadLink()
  .subscribe(
    (resp: HttpResponse<Blob>) => {
      console.log(resp.headers.get('content-disposition'));
      data = resp.body
    });

此外，在服务器端，需要设置以下标头作为响应。 'Access-Control-Expose-Headers': 'Content-Disposition'

与Java Spring Boot一样，可以使用

执行相同的操作

    final HttpHeaders headers = new HttpHeaders();
    headers.add(HttpHeaders.CONTENT_DISPOSITION, "attachment; filename=1.xlsx");
    headers.add(HttpHeaders.ACCESS_CONTROL_EXPOSE_HEADERS, HttpHeaders.CONTENT_DISPOSITION);

Answer 4

使用Angular 9和Expresss

需要在Express中允许此标头

res.setHeader('Access-Control-Expose-Headers', 'Content-Disposition');

角度

this.http.get(url, { observe: 'response', responseType: 'blob' as 'json' })
.subscribe((res: any) => {
    console.log(res.headers.get('content-disposition'));
});

Answer 5

在Angular 7中，向上投票的方法不起作用，您需要这样做：

const responseHeaderFilename = response.headers.get('content-disposition');

有关更多详细信息，请找到Angular官方文档：https://angular.io/guide/http#reading-the-full-response

，并确保像@mslugx答案一样公开“ Content-Disposition”

Answer 6

我们可以读取文件名，如下所示，

  this.http.post(URL, DATA).subscribe(
        (res) => {
            var contentDisposition = res.headers.get('content-disposition');
            var filename = contentDisposition.split(';')[1].split('filename')[1].split('=')[1].trim();
            console.log(filename);
        });

但是最主要的是，我们需要在API中指定 Access-Control-Expose-Header ，如下所示，

注意：最后一行是必填项

FileInfo file = new FileInfo(FILEPATH);

HttpResponseMessage response = new HttpResponseMessage(HttpStatusCode.OK);
response.Content.Headers.ContentDisposition = new ContentDispositionHeaderValue("attachment")
{
    FileName = file.Name
};
response.Content.Headers.Add("Access-Control-Expose-Headers", "Content-Disposition");

Answer 7

要从响应头获取文件名。

(data)=>{  //the 'data' is response of file data with responseType: ResponseContentType.Blob.
    let filename = data.headers.get('content-disposition').split(';')[1].split('=')[1].replace(/\"/g, '')
}

如何从服务器响应角度2读取内容处置标头

7 个答案: