前端取不到后台返回response里边header内容问题

- 日理万妓 2022-09-02 00:51 666阅读 0赞

我是在前后端调试下载文件的时候遇到的问题。

我下载文件的方式是返回二进制流。这种方式的话实际上是不能有return的，也就是时候不能把一些内容带给前端。比方说文件名，我们就需要放header里边。但是默认情况下，前端拿不到你定义的header字段。

那么解决方式实际上是比较简单的，我的解决方案如下：

response.reset();
            response.setHeader("Access-Control-Allow-Origin", "*");
            response.setHeader("Content-Disposition", "attachment;fileName=" + exportFileName.toString());
            response.setHeader("Access-Control-Expose-Headers", "Content-Disposition");
            OutputStream os = response.getOutputStream();
            // 把文件的标题放到下载的文件流中
            os.write(exportTitle.toString().getBytes(StandardCharsets.UTF_8));

关键点1：这是通用的下载方式，我看了网上的案例都有部分。其中Content-Disposition相当于是自定义的一个header，这个前端是取不到的。我把文件名放在这里边了。

response.setHeader("Content-Disposition", "attachment;fileName=" + exportFileName.toString());

关键点2：其实结局问题就是想要解决如何拿到自定义header “Content-Disposition”的问题了，这里我定义的字段叫做 “Content-Disposition”，你自己定义的字段可能是其他的。替换掉就可以。然后添加下边的一行代码，也就是放开权限，让前端取到这个字段。

response.setHeader("Access-Control-Expose-Headers", "Content-Disposition");

关键点3：如果有多个的话，用英文逗号分割。

response.setHeader("Access-Control-Expose-Headers", "Content-Disposition,other-field");