Angular 4中文件的“响应标头”值问题答案

【问题标题】：Problem with 'Response Headers' values of File in Angular 4Angular 4中文件的“响应标头”值问题
【发布时间】：2018-11-27 04:04:58
【问题描述】：

我有一个 web 服务，它返回一个 pdf 文件 (byte[]) 和响应标头中的文件名。

我可以在 Chrome 上看到“响应标头”的值，并且每个人都在那里（包括文件名）。但我无法在 Angular 上获取这些值，因为标头值只是“Content-Type:application/pdf”。

我的 Angular 代码：

  getPdf(url: string){

    http.get(url, {responseType: 'arraybuffer', observe:'response'})
        .subscribe(data => {
            console.log(data.headers.get('filename')); // print: null
            console.log(data.headers.keys()); // print: ["Content-Type"],
            downloadFile(data.body);
    });
  }

浏览器上的响应标头：

Access-Control-Allow-Credentials:true
Access-Control-Allow-Headers:Origin, X-Request-Width, Content-Type, Accept, authCode
Access-Control-Allow-Origin:*
Connection:keep-alive
Content-Disposition:attachment; filename=file.pdf
Content-Type:application/pdf
Date:Mon, 26 Nov 2018 14:23:37 GMT
filename:file.pdf
Server:JBoss-EAP/7
Transfer-Encoding:chunked
X-Powered-By:Undertow/1

有什么问题吗？我怎样才能正确地做到这一点？

【问题讨论】：

标签： angular rest http response-headers

【解决方案1】：

我使用网络服务上的“Access-Control-Expose-Headers”解决了我的问题。

我的 java 网络服务：

    protected Response buildFile(Status status, byte[] file, String nomeArquivo) {
    return Response.status(status)
            .entity(file)
            .header("Access-Control-Allow-Credentials", "true")
            .header("Access-Control-Expose-Headers", "Content-Disposition, filename")
            .header("Content-Type", "application/pdf")
            .header("Content-Disposition", "attachment; filename="+ nomeArquivo)
            .header("filename", nomeArquivo)
            .build();
}

【讨论】：