const url = `/eehds/epidemic/print?taskId=${this.taskId}&isPrint=true`
axios({
method: 'get',
url: url,
headers: {},
responseType: 'blob',
}).then(response => {
let blob = new Blob([response.data], { type: 'application/pdf;charset=utf-8' })
let href = window.URL.createObjectURL(blob)
window.open(href)
在前端下载文件是个很通用的需求,一般后端会提供下载的方式有两种:1.直接返回文件的网络地址(一般用在静态文件上,比如图片以及各种音视频资源等)2.返回文件流(一般用在动态文件上,比如根据前端选择,导出不同的统计结果 excel 等)第一种方式比较简单,但是使用场景有限。第二种方式通用性更好。
blob转file
URL.createObjectURL() 静态方法会创建一个 DOMString,其中包含一个表示参数中给出的对象的URL。这个 URL 的生命周期和创建它的窗口中的 document 绑定。这个新的URL 对象表示指定的 File 对象或 Blob 对象。
在每次调用 createObjectURL() 方法时,都会创建一个新的 URL 对象,即使你已经用相同的对象作为参数创建过。当不再需要这些 URL 对象时,每个对象必须通过调用 URL.revokeObjectURL() 方法来释放。
下面的示例是
```html
<object data="data:application/pdf;base64,PDF文件流数据" type="application/pdf" width="100%" height="600px">
<p>您的浏览器不支持查看PDF文件,请下载<a href="data:application/pdf;base64,PDF文件流数据" download>PDF文件</a>查看。</p>
</object>
其中,`data` 属性值为 PDF 文件的 base64 编码数据,`type` 属性值为 `application/pdf`,`width` 和 `height` 可以设置显示的宽度和高度。
2. 使用 JavaScript 打开 PDF 文件流:
```javascript
var fileData = 'PDF文件流数据';
var blob = new Blob([fileData], { type: 'application/pdf' });
var url = URL.createObjectURL(blob);
window.open(url);
其中,`Blob` 对象用于创建一个二进制对象,`URL.createObjectURL` 方法用于生成一个 URL,`window.open` 方法用于打开新窗口并显示 PDF 文件。
注意:以上两种方法都需要保证浏览器支持 PDF 文件的查看。如果浏览器不支持,则需要提供下载链接供用户下载查看。