vue element通过后台接口下载fastdfs服务器上的文件

最新推荐文章于 2024-09-03 11:47:52 发布

m0_37906846

最新推荐文章于 2024-09-03 11:47:52 发布

阅读量1k

点赞数

本文链接：https://blog.csdn.net/m0_37906846/article/details/102725460

版权

本文介绍如何在Vue Element项目中，通过后台接口实现动态下载存储在FastDFS服务器上的文件。主要包括前端页面的构建，调用JavaScript方法，后台Controller的编写以及使用的工具类。

摘要由CSDN通过智能技术生成

1，前端页面

<el-button type="primary" @click="downloadHandle()">下载模板</el-button>

2，调用js

downloadHandle () {
        this.$http({
          url: this.$http.adornUrl('/custom/publicfile/upload'),
          method: 'get',
          params: this.$http.adornParams({
            'fileName': '审计台账模板'
          }),
          responseType: 'blob'
        }).then((res) => { // 处理返回的文件流
          let blob = new Blob([res.data])
          if (window.navigator.msSaveOrOpenBlob) {
            navigator.msSaveBlob(blob, '审计台账模板.xlsx')
          } else {
            let elink = document.createElement('a')
            elink.download = '审计台账模板.xlsx'
            elink.style.display = 'none'
            elink.href = URL.createObjectURL(blob)
            document.body.appendCh