题目描述

一个通过微信查看和下载pdf文件的功能，用的是vue+pdfjs-dist，渲染出 pdf 没有什么问题，下载pdf文件在PC端的chrome浏览器和手机端的chrome浏览器是正常的，但是在微信上打开按下载按钮一点反应都没有，也没有报错。

相关代码

data 是 pdf 转成文件流

download(id, data) {
  if (!data || !id) {
    Toast.failed("无法下载");
    return;
  }
  console.log(data.data);
  let pdf_url = window.URL.createObjectURL(
    new Blob([data.data], { type: "application/pdf" })
  );
  let link = document.createElement("a");
  link.setAttribute("download", id + ".pdf");
  link.setAttribute("target", "_self");
  link.href = pdf_url;
  link.style.display = "none";
  document.body.appendChild(link);
  link.click();
  document.body.removeChild(link);
  window.URL.revokeObjectURL(pdf_url);
}

问题出现的环境背景及自己尝试过哪些方法

我尝试写了个<a>来下载文件，在微信上也是下载不下来的，是不是微信浏览器本身的限制？？？

相关代码

<a :href="require('@/assets/logo.png')" download="logo.png" target="_self">下载文件</a>

页面能实现下载那是应为浏览器作为一款app拥有手机下载功能的接口权限，用input就能实现下载，app里面打开页面用的都是webview，想要下载必须通过与app交互实现；微信没有提供给h5页面这个接口，还是指引用户去普通浏览器下载吧。

微信限制了，外部链接下载需要写引导页，引导用户打开用浏览器打开

移动端下载本身就有问题。

需要依赖下载头

微信限制了.
你没看很多页面都是弹窗引导右上角浏览器打开再下载么

遇到同样的问题 你怎么解决的？？

    download(name, data) {
      if (!data) {
        return;
      }
      // console.log(data);
      let url = window.URL.createObjectURL(new Blob([data.data]));
      let link = document.createElement("a");
      link.style.display = "none";
      link.href = url;
      link.setAttribute("download", name + ".pdf");
      document.body.appendChild(link);
      link.click();
      document.body.removeChild(link);
      window.URL.revokeObjectURL(url);
    }