vue 文件下载

༺༽༾ཊ方觉ཏ༿༼༻2024-03-27 11:13

1.返回路径下载

注: 针对一些浏览器无法识别的文件格式（如pdf、xls、ppt）。可以直接在地址栏上输入URL即可触发浏览器的下载功能。

情况1

复制代码

 //地址栏输入文件URL
 window.location.href = URL
 window.open(URL)

注:该方式将下载逻辑放在后端处理，后端给出固定的url，前端使用window.location.herf下载

路径可以是相对路径也可以是绝对路径

情况2

注:直接下载（使用a标签download属性）

复制代码

<a  :href="scope.row.vPath" :download="scope.row.vName" class="downloadBtn">
      <el-button type="text">下载</el-button>
</a>

2.OSS存储方式的文件地址

注:这种方式的文件地址被访问时，访问文件路径默认是下载还是预览跟后端设置的服务器配置有关。

如果访问oss地址的文件只能预览，那么这种文件要下载的解决方式：

链接如

复制代码

<a href="http://xxxx/octet-stream" target="_blank" download="" ></a>

3.通过后端反回流,前端进行下载

平台返回二进制流格式如图