问答

文件下载,后台返回的是一个外链url,前端应该怎么处理?

作者:admin 2021-04-16 我要评论

现在需求是文件下载,任意类型文件,后台返回的是一个外链url。 我是通过创建 a 标签去下载。但是这个会出现pdf文件和图片预览的情况。 请问怎么做可以避免预览...

在说正事之前,我要推荐一个福利:你还在原价购买阿里云、腾讯云、华为云服务器吗?那太亏啦!来这里,新购、升级、续费都打折,能够为您省60%的钱呢!2核4G企业级云服务器低至69元/年,点击进去看看吧>>>)

现在需求是文件下载,任意类型文件,后台返回的是一个外链url。
我是通过创建 a 标签去下载。但是这个会出现pdf文件和图片预览的情况。
请问怎么做可以避免预览,无论哪种类型文件,都可以通过外链url直接下载?
谢谢

###
// path name
const xhr = new XMLHttpRequest();
    xhr.open('get', path);
    xhr.responseType = 'blob';
    xhr.send();
    xhr.onload = function () {
      if (this.status === 200 || this.status === 304) {
        // 如果是IE10及以上,不支持download属性,采用msSaveOrOpenBlob方法,但是IE10以下也不支持msSaveOrOpenBlob
        if ('msSaveOrOpenBlob' in navigator) {
          navigator.msSaveOrOpenBlob(this.response, name);
          return;
        }
        // const blob = new Blob([this.response], { type: xhr.getResponseHeader('Content-Type') });
        // const url = URL.createObjectURL(blob);
        const url = URL.createObjectURL(this.response);
        let eleLink = document.createElement("a");
        eleLink.href = url;
        eleLink.download = name;
        eleLink.style.display = "none";
        document.body.appendChild(eleLink);
        eleLink.click();
        document.body.removeChild(eleLink);;
        URL.revokeObjectURL(url);
      }
    };

版权声明:本文转载自网络,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。本站转载出于传播更多优秀技术知识之目的,如有侵权请联系QQ/微信:153890879删除

相关文章
  • nginx响应速度很慢

    nginx响应速度很慢

  • 点击选中的多选框,会在已选那一栏显示

    点击选中的多选框,会在已选那一栏显示

  • PHP 多态的理解

    PHP 多态的理解

  • 关于C语言中static的问题

    关于C语言中static的问题

腾讯云代理商
海外云服务器