2021/05/31 通过PDF外链实现PDF文件下载

• 背景
  –1.请求接口得到的数据是一个指向PDF文件，存放在阿里云oss 上的链接。类似如下
  url: “http://aaa.bbb.com/dedfa95299474609a7ada88ab4ed7c921620895919739.pdf”
  

–2.get请求该链接，会得到返回的文件流。文件流类似这种

---

• 我是直接用fetch请求的
  代码

//获取blob文件流 下载PDF文件 成功
    fetchBlob() {
      //不传cookie
      window
        .fetch(this.pdfUrl, {
          method: "get",
          responseType: "blob",
        })
        .then((res) => {
          console.log("blob res", res);
          return res.blob();
        })
        .then((blob) => {
          console.log("下载 blob", blob);
          let bl = new Blob([blob], { type: "application/pdf" });
          //自定义修改 命名规则
          let fileName = Date.parse(new Date()) + ".pdf";
          var link = document.createElement("a");
          link.href = window.URL.createObjectURL(blob);
          link.download = fileName; //时间戳命名
          link.click();
          window.URL.revokeObjectURL(link.href);
        });
    },

---

• 参考链接
  –这里描述了fetch请求的不同类型
  fetch请求获取blob和arraybuffer文件流及核心API使用总结
  解决iframe接受流并且跨域打印问题（外链还是会跨域）

–如果遇到报错
报错信息：not be the wildcard ‘*’ when the request’s credentials mode is ‘include’.

我这里是由于封装的组件，默认请求在请求头中携带了cookie

所以也能直接用window.fetch来获取文件流