VUE+SpringBoot文件上传与下载

最新推荐文章于 2024-05-13 19:30:26 发布

划破渺茫

最新推荐文章于 2024-05-13 19:30:26 发布

阅读量836

点赞数

分类专栏：工作问题解决

本文链接：https://blog.csdn.net/hou956643882/article/details/117425038

版权

7 篇文章 0 订阅

订阅专栏

背景

使用VUE+SpringBoot实现文件的上传与下载，使用antd的a-upload作为上传按钮（样式），遇到了问题，这里记录一下。

文件在上传时，通过formData.append拼接字段，注意红框部分，这里的file最后是一个二进制流，不要把一个file对象传过去，不然后端的MultipartFile接收不到
上传这里需要注意，我们的Content-type需要写成multipart/form-data ，否则application/json（序列化后的 JSON 字符串），application/x-www-form-urlencoded（浏览器默认，原生 form 表单）
如果是多个文件的上传，不要传file数组或二进制数组！！！否则后端接收不到值，如果有这种需求，可以继续append，key可以重复，value不会覆盖，后端使用数组来接收。

后端的下载这里简单说一下：首先是通过response拿到输出流对象，然后写入response中。上图来自网站：https://blog.csdn.net/javaloveiphone/article/details/8133772，作者：逍遥不羁
如果到下载多个文件，建议打成一个zip文件或多次调用下载文件接口
前端这里的responseType要写成arraybuffer，我们会拿到一个ArrayBuffer的返回值，根据该对象创建一个Blob对象，创建一个不可见的超链接，链接地址是根据Blob创建的URL，模拟点击然后再删除改超链接
ArrayBuffer和Blob区别如下（来自：https://blog.csdn.net/weixin_41849462/article/details/103409341 作者：张贺_）

关注

专栏目录