从针对跨源http.get请求的ASP.NET Web API 2响应中获取Angular中的特定响应头(例如,Content-Disposition)

Dyd*_*666 11 c# cors owin asp.net-web-api2 angular

Content-Disposition当我通过Angular服务访问它时,我无法获得特定的header().启用CORS并将Angular HTTPClient设置为检索所有标头.

Startup.cs

 public void Configuration(IAppBuilder app)
        {

            HttpConfiguration config = new HttpConfiguration();
            WebApiConfig.Register(config);
            ConfigureOAuth(app, config);
            app.UseCors(Microsoft.Owin.Cors.CorsOptions.AllowAll);
            app.UseWebApi(config);
 } 
Run Code Online (Sandbox Code Playgroud)

fileController.cs

[Route("file/{idFile}")]
        public HttpResponseMessage GetFile(string idFile)
        {
            string file;
            byte[] file;

            document = fileService.GetFile(idDFile, out fileName);

            var result = new HttpResponseMessage(HttpStatusCode.OK)
            {
                Content = new ByteArrayContent(file)
            };
            result.Content.Headers.ContentDisposition =
                new System.Net.Http.Headers.ContentDispositionHeaderValue("attachment")
                {
                    FileName = nomeFile
                };
            result.Content.Headers.ContentType =
                new MediaTypeHeaderValue("application/octet-stream");

            return result;
        }
Run Code Online (Sandbox Code Playgroud)

fileService.ts

getFile(fileId: number): Observable<Response> {
        const url = `${urlBackEnd}/file/${fileId}`;
        return this.http.get(url, { observe: 'response', responseType: 'blob' })
          .map(res => {;
            console.log(res.headers.keys()); // There's no CONTENT-DISPOSITION
            saveAs(<Blob>res.body);
            return res.body;
          })
          .catch(e => this.handleErrors(e));
}
Run Code Online (Sandbox Code Playgroud)

这是标题console.log:

[
  "content-type",
  "cache-control"
]
Run Code Online (Sandbox Code Playgroud)

我错过了什么?我只想得到Content-Disposition标题.

sid*_*ker 15

fileController.cs文件中,设置Content-TypeContent-Disposition响应标头,您需要设置Access-Control-Expose-Headers:

result.Content.Headers.Add("Access-Control-Expose-Headers", "Content-Disposition");
Run Code Online (Sandbox Code Playgroud)

请注意,虽然Fetch规范实际上允许" *"作为值Access-Control-Expose-Headers(虽然通过阅读当前规范文本不是很清楚......) - 浏览器还不符合规范; 所以不是你应该明确地列出所有响应头名浏览器应该暴露在你的前端JavaScript代码-除了Cache-Control,Content-Language,Content-Type,Expires,Last-Modified,和Pragma,它总是暴露.对于除了那六个之外的任何响应头以及您在Access-Control-Expose-Headers头的值中明确列出的那些,浏览器阻止前端代码访问它们.

  • 不知道这是否太重要了–我不得不使用带连字符的名称:`Content-Disposition` ::`result.Content.Headers.Add(“ Access-Control-Expose-Headers”,“ Content-Disposition” );` (2认同)