1官方文档:pdf.js
2效果图:
3使用指南
参考博客:
https://blog.csdn.net/qq_37122349/article/details/127572375?spm=1001.2101.3001.6650.2&utm_medium=distribute.pc_relevant.none-task-blog-2%7Edefault%7EYuanLiJiHua%7EPosition-2-127572375-blog-108522343.pc_relevant_default&depth_1-utm_source=distribute.pc_relevant.none-task-blog-2%7Edefault%7EYuanLiJiHua%7EPosition-2-127572375-blog-108522343.pc_relevant_default&utm_relevant_index=5
4对接后端代码
保证能够可以直接访问http://10.30.10.118:8081/pdf/web/viewer.html即可
1前端创建一个预览页面的公共组件
2get请求后端返回的"application/pdf"流文件,在浏览器可以直接预览
3前端接收请求url返回的流数据 this.objectUrl=window.URL.createObjectURL(data)
4<iframe v-if="objectUrl.length"id="pdf-content" :src="`http://10.30.10.118:8081/pdf/web/viewer.html?file=${objectUrl}`"></iframe>