vue 下载附件采坑

话不多说直接上前端代码:

downFile(index, rows){ //index 表示选的第几行   rows表示整个列表    rows[index]表示当前行数据
      var curRow = rows[index];
      var fileName = curRow.fileName;
      var physicalPath = curRow.physicalPath; // 文件路径
      if (undefined == fileName) {
        return;
      }
      if ('' == fileName) {
        return;
      }
      var suffix = fileName.substring(fileName.lastIndexOf(".") + 1)

      var blobType = '';
      if (suffix.toLocaleUpperCase() == 'DOCX') {
        blobType = 'application/vnd.openxmlformats-officedocument.wordprocessingml.document;charset=utf-8';
      } else if (suffix.toLocaleUpperCase() == 'DOC') {
        blobType = 'application/msword';
      } else if (suffix.toLocaleUpperCase() == 'XLSX') {
        blobType = 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet';
      } else if (suffix.toLocaleUpperCase() == 'XLS') {
        blobType = 'application/vnd.ms-excel';
      } else if (suffix.toLocaleUpperCase() == 'PDF') {
        blobType = 'application/pdf';
      } else if (suffix.toLocaleUpperCase() == 'PNG') {
        blobType = 'image/png';
      } else if (suffix.toLocaleUpperCase() == 'JPEG') {
        blobType = 'image/jpeg';
      } else if (suffix.toLocaleUpperCase() == 'JPG') {
        blobType = 'image/jpeg';
      }else{
      	this.$message.error('只能下载:DOCX、DOC、XLSX、XLS、PDF、PNG、JPEG、JPG类型的文件!')
      	return
      }

      request({
        url: this.GLOBAL.PROJECT_ID + '/api/file/downFile?physicalPath='+physicalPath,
        method: 'get',
        responseType: 'arraybuffer'
      }).then(response => {
        var blob = new Blob([response], {type: blobType});
        var href = URL.createObjectURL(blob);

        var downloadElement = document.createElement('a');
        downloadElement.href = href;
        downloadElement.download  = fileName; // 下载后文件名
        document.body.appendChild(downloadElement);
        downloadElement.click(); // 点击下载
        document.body.removeChild(downloadElement); // 下载完成移除元素
        window.URL.revokeObjectURL(href); // 释放掉blob对象

      }).catch(function(reason) {
        console.log('catch:', reason);
      });
		}

后端代码:
在这里插入图片描述

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值