基于VUE利用pdf.js实现文件流形式的pdf显示(转载)

@TOC

基于VUE利用pdf.js实现文件流形式的pdf显示(转载)

源链接：基于VUE利用pdf.js实现文件流形式的pdf显示

这儿我们着重介绍一下通过文件流的形式打开pdf。（所谓文件流，就是通过ajax请求，返回的数据是文件流的形式）
1. 首先通过下载pdf.js的相关文件，当然我推荐直接拷贝 链接: vue-pdf.js-demo里面的文件，然后放到static目录里面

2. 第二步就是直接使用了
在组件中合适的地方放入 iframe

<iframe class="prism-player" :src="pdfUrl" width="100%" height="100%"></iframe>

3. 然后就是获取pdfUrl

// 这儿的url， 就是通过 axios 进行请求的地址，只不过换成了从导航url进行请求的方式
let url = process.env.BASE_API + '/coursePartDetail/getFileStreamByCoursePartDetailId?CoursePartDetailId=' + this.sectionMsg.id
this.pdfUrl = `/static/pdf/web/viewer.html?file=${encodeURIComponent(url)}`