springboot:各种下载文件的方式

x33g5p2x  于2022-06-06 转载在 Spring  
字(3.0k)|赞(0)|评价(0)|浏览(482)

springboot:各种下载文件的方式

一、使用response输出流下载

注意第一种方式返回值必须为void

@GetMapping("/t1")
    public void down1(HttpServletResponse response) throws Exception {
        response.reset();
        response.setContentType("application/octet-stream;charset=utf-8");
        response.setHeader(
                "Content-disposition",
                "attachment; filename=test.png");
        try(
                BufferedInputStream bis = new BufferedInputStream(new FileInputStream("E:\\desktop\\1.png"));
                // 输出流
                BufferedOutputStream bos = new BufferedOutputStream(response.getOutputStream());
        ){
            byte[] buff = new byte[1024];
            int len = 0;
            while ((len = bis.read(buff)) > 0) {
                bos.write(buff, 0, len);
            }
        }
    }

二、使用ResponseEntity

@GetMapping("/t2")
    public ResponseEntity<InputStreamResource> down2() throws Exception {
        InputStreamResource isr = new InputStreamResource(new FileInputStream("E:\\desktop\\1.png"));
        return ResponseEntity.ok()
                .contentType(MediaType.APPLICATION_OCTET_STREAM)
                .header("Content-disposition", "attachment; filename=test1.png")
                .body(isr);
    }

    @GetMapping("/t3")
    public ResponseEntity<ByteArrayResource> down3() throws Exception {
        byte[] bytes = Files.readAllBytes(new File("E:\\desktop\\1.png").toPath());
        ByteArrayResource bar = new ByteArrayResource(bytes);
        return ResponseEntity.ok()
                .contentType(MediaType.APPLICATION_OCTET_STREAM)
                .header("Content-disposition", "attachment; filename=test2.png")
                .body(bar);
    }

三、注意

后端使用前三种的一种方式,请求方式使用非GET请求,前端使用Blob类型接收

某些情况下,在下载时需要向后端POST一些参数,这时需要前端做一定配合,将接收类型设定为Blob

@PostMapping("/t4")
    public ResponseEntity<ByteArrayResource> down4(String fileName, @RequestBody Map data) throws Exception {
        System.out.println(data);
         byte[] bytes = Files.readAllBytes(new File("E:\\desktop\\1.png").toPath());
        ByteArrayResource bar = new ByteArrayResource(bytes);
        return ResponseEntity.ok()
                .contentType(MediaType.APPLICATION_OCTET_STREAM)
                .header("Content-disposition", "attachment; filename=test.png")
                .body(bar);
    }

前端代码(这里使用了原生的ajax):

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script>
      function download() {
        var ajax = new XMLHttpRequest();
        ajax.withCredentials = true;
        ajax.responseType = "blob";
        const fileName = "ttt.txt";
        ajax.open('post','http://localhost:7901/demo/down/file/t4?fileName=' +  fileName);
        ajax.setRequestHeader("Content-Type","application/json;charset=utf-8");
        // ajax.setRequestHeader("Accept","application/json;charset=utf-8");
        ajax.send(JSON.stringify({firstName:"Bill", lastName:"Gates", age:62, eyeColor:"blue"}));
        ajax.onreadystatechange = function () {
          if (ajax.readyState==4 &&ajax.status==200) {
            console.log(ajax.response);
              const href = URL.createObjectURL(ajax.response);
              const a = document.createElement('a');
              a.setAttribute('href', href);
              a.setAttribute('download', fileName);
              a.click();
              URL.revokeObjectURL(href);
          }
        }
      }
    </script>
</head>
<body>
  <input type="button" value="下载" onclick="download();"/>
</body>
</html>

相关文章