最近用到了 springboot
项目返回二进制流,话不多说,代码贴上:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27
| @PostMapping(value = "/file/{fileName}") public ResponseEntity<FileSystemResource> getFile(@PathVariable("fileName") String fileName) throws FileNotFoundException { File file = new File(filePath, fileName); if (file.exists()) { return export(file); } System.out.println(file); return null; } public ResponseEntity<FileSystemResource> export(File file) { if (file == null) { return null; } HttpHeaders headers = new HttpHeaders(); headers.add("Cache-Control", "no-cache, no-store, must-revalidate"); headers.add("Content-Disposition", "attachment; filename=" + file.getName()); headers.add("Pragma", "no-cache"); headers.add("Expires", "0"); headers.add("Last-Modified", new Date().toString()); headers.add("ETag", String.valueOf(System.currentTimeMillis())); return ResponseEntity.ok() .headers(headers) .contentLength(file.length()) .contentType(MediaType.parseMediaType("application/octet-stream")) .body(new FileSystemResource(file)); }
|
前端 Vue
代码:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21
| downloadXLSXFile() { var that = this; that.axios .post( "/download/XLSXExampleFile", { fileId: 123 }, { responseType: "blob" } ) .then((res) => { let blob = new Blob([res.data], { type: "application/octet-stream", });
let url = window.URL.createObjectURL(blob); let a = document.createElement("a"); a.href = url; a.download = "text.xslx"; a.click(); window.URL.revokeObjectURL(url); }); }
|
同时贴一个 Springboot
接受前端 `Vue`` 对象参数
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24
| @Slf4j @RequestMapping("/business") @RestController public class SubmitController { @Autowired private SubmitService submitService;
@PostMapping("/submit") public ResultVO submitAction(@RequestBody UploadFileSubmitEntity uploadFileSubmitEntity){ log.info("start submitAction ..."); log.info(uploadFileSubmitEntity.toString()); return submitService.submitAction(uploadFileSubmitEntity); } }
@Data public class UploadFileSubmitEntity { @JsonProperty("GZFileList") private ArrayList<UploadRes> GZFileList; @JsonProperty("XLSXFileList") private ArrayList<UploadRes> XLSXFileList; }
|
前端:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18
| var that = this; var param = { "GZFileList": this.GZFileList, "XLSXFileList": this.XLSXFileList, }; that.axios({ method: "post", url: "/business/submit", data: JSON.stringify(param), headers: { "Content-Type": "application/json;charset=UTF-8", }, }) .then((res) => { if(res.data.code == 200){ that.$message.success("submit successfully! , Plz wait for some time ."); } });
|