a标签无法下载pdf文件，只能预览时的解决方法

最新推荐文章于 2025-05-24 20:36:00 发布

solitude1128

最新推荐文章于 2025-05-24 20:36:00 发布

阅读量2.1k

点赞数 1

CC 4.0 BY-SA版权

文章标签： pdf 前端 jquery vue

本文链接：https://blog.csdn.net/solitude1128/article/details/131659791

当面临域名不同导致无法直接下载的问题时，通过HTTPGET请求获取文件流，然后在前端处理成Blob对象，创建ObjectURL并利用HTML的a标签模拟点击下载。该方法在jQuery的Ajax中有效，但遇到相同情况使用axios时出现问题。寻求解答关于axios处理文件流下载的解决方案。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

可能的问题有很多，我遇到的问题是域名不同，所以只能预览，不能下载

最后解决办法是，用http请求文件，接口返回文件流，前端处理后，就可以下载了

具体代码如下 ⬇️


      var array = "";
      $.ajax({
        type: "GET",
        async: false, // false是不采用异步的方式
        mimeType: "text/pdf;charset=x-user-defined",
        url: file,//这里放pdf的url
        responseType: "blob",
        success: function (data) {
          //data返回的文件流
          var rawLength = data.length;
          array = new Uint8Array(new ArrayBuffer(rawLength));
          for (var i = 0; i < rawLength; i++) {
            array[i] = data.charCodeAt(i) & 0xff; //转二进制流
          }
          const link = document.createElement("a");
          let blob = new Blob([array], { type: "application/pdf" });
          let url = URL.createObjectURL(blob);
          link.href = url;
          link.download = file;//这里我用的是pdf的url，具体名字也可以自定义，例如1.pdf
          link.click();
        },
      });Ï

随便搞个html文件就可以试了

记得引入jq的在线链接

<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.4/jquery.js"></script>

但是很困扰我的一个问题是我用axios，给一样的参数就不能用

jq的ajax就没问题，有大神可以帮忙解答下吗？感谢！