文件上传、下载功能

247 阅读1分钟

通过接口实现下载功能

代码如下,可以直接通过a标签实现下载功能,但是这段代码会有一个问题,如果要下载的文件时图片类型,会引发跨域问题

image.png

为了解决跨域问题,代码如下,通过canvas对象进行转换

image.png

但是此时如果将代码变成这种格式的话还有问题就是除图片类型的文件无法下载了,由于后端返回给我的是地址url,我采用的通过正则表达式区别图片类型以及非图片类型文件

image.png

完整代码如下

上传功能

我是使用的vue3+elementplus,template层添加on-change属性绑定一个函数

image.png

通过new一个formdata对象,传递文件信息

image.png