blob文件流前端显示pdf三种方法

首先请求需要修改
responseType: ‘blob’, 需要修改

// 请求头
{
    responseType: 'blob',
    url: url,
    method: 'get',
}

三种方法：

1.直接处理，在新页面打开

const blob = new Blob([data],{
	type:'application/pdf'
})

let url = window.URL.createObjectURL(blob)

window.open(url,'_blank')

// 问题在于父页面关闭或者刷新后，文件页面获取不到文件流，刷新显示空白页。
// 可以把url放在弹层里的iframe里，可以解决此问题

2.在新页面用iframe接

<iframe :src='xxxxxx'>

// 问题在于点击iframe中文件之后无法在iframe监听事件，ctrl+p 显示空白

3.使用pdf.js

到 mozilla.github.io/pdf.js/gett… 页面中找到下载位置，下载 PDF.js
在viewer.js 修改
注释下列代码   不然 可能会出现跨域错误，无法正常预览文件
if (origin !== viewerOrigin && protocol !== "blob:") {
  throw new Error("file origin does not match viewer's");
}

转自：blob文件流前端显示pdf三种方法