前端JS获取PDF文件流，将blob对象转换成下载链接打开后一篇空白的问题

 

重点来了大家不要踩坑：这种一般都是格式问题，要在ajax方法中添加参数，确保传输的数据格式，接收到数据后也要再三确认格式：

 

 const downloadPdf = () => {
         PurchaseOrderDetailApi.downloadPdf(id).then((response) => {
          
             const blob = response.rawRes.data
 
             const blobob = new Blob([blob], { type:'application/pdf;charset=utf-8' });
             //Convert the requested BLOB data to a downloadable URL address
             let URL = window.URL || window.webkitURL;
             const href = window.URL.createObjectURL(blobob); 
             window.open(href);
             
            //  The following code is reserved to prevent modification
            //  const downloadElement = document.createElement('a');
            //  downloadElement.href = href;
            //  downloadElement.download = decodeURI(fileName); 
            //  document.body.appendChild(downloadElement);
            //  downloadElement.click(); 
            //  document.body.removeChild(downloadElement); 
            //  window.URL.revokeObjectURL(href);
            //  const a = document.createElement('a');
            //  a.download = '';
            //  a.href = url;
            //  a.click();
         
         });

 注意postForm确认传输form表单格式 

responseType:'blob'

 请求API方法：

  async downloadPdf(id) {
       
        let url = '/api/purchase/purchaseOrders/downloadOrderPDF';
        let param = {
            responseType:'blob'
        }
        return RestClient.postForm(url, {id:id},param);
    },

还有new Blob([blob], { type:'application/pdf;charset=utf-8' }) 加了一句：

{ type:'application/pdf;charset=utf-8' }

      这下跳转就正常了：