关于解决点击文本链接浏览器会打开的问题(让其下载,而不是打开)

第四次是我成功的方案 其他只作为记录 (解决问题直接去看第四方案)

第一次尝试:

window.open(url)

这种情况遇见浏览器不能识别的会下载,浏览器能识别到的还会打开,比如text文本链接等。
第二次尝试:

window.location.href = url

这种用法和第一次效果相同
第三次尝试:

var a= document.createElement('a');
document.body.appendChild(a);
a.href = url;
a.download = filename;
a.click();
document.body.removeChild(a);

咳咳 想靠动态创建a标签来进行点击下载text文件 结果失败
第四次尝试:

downloadFile(url,fileName) {
      var x = new XMLHttpRequest();
      x.open("GET", url, true);
      x.responseType = 'blob';
      x.onload = function (e) {
        var url = window.URL.createObjectURL(x.response)
        var a = document.createElement('a');
        a.href = url
        a.download = fileName ; 
        a.click()
      }
      x.send();
      this.$message.success('下载成功!')
    }

哎!!这就可以了 url本身就是给api 创建个XMLHttpRequest对象请求后为Blob数据 对其再生成一个url 这样浏览器就不会再识别成打开text文件了

方案五(这个方案我没尝试,无意间看到的,本质和方案四差不多)

  axios({

                url: `${Prefix}/xxx/xxx`,

                method: 'post',

                responseType: 'blob',

                data: {},

              }).then((result) => {

                let filename = result.headers['content-disposition'] .split(';')[1].split('filename=')[1];

                var blob = new Blob([result.data], {
                type:
'application/vnd.openxmlformatsofficedocument.spreadsheetml.sheet;charset=utf-8',
                  }),
                 Temp = document.createElement('a');

                Temp.href = window.URL.createObjectURL(blob);

                Temp.download = window.decodeURI(filename);

                document.body.appendChild(Temp);

                Temp.click();

                document.body.removeChild(Temp);

                window.URL.revokeObjectURL(Temp);
              });
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值