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>