好久沒寫東西，19年之前寫過一篇Vue2將pdf二進制文件流轉換成pdf文件，如果Vue2換成Vue3了，順帶來一篇文章，pdf.js這個東西用來解決內網pdf預覽，是個不錯的選擇。

首先去pdfjs官網，下載需要的文件

然后將下載的東西放到public文件下

接下來看一下代碼

<auto-dialogtitle="PDF預覽":visible="visible":appendToBody="true"@close="close"width="850px"id="pdfDialog"class="pdfDialog"><template #content><divclass="pdfContent"id="pdfContent"v-loading="loading"element-loading-text="PDF加載中..."><iframe v-if="showPdf" id="previewPdf" :src="pdfSrc" height="500px" width="100%"> </iframe></div></template></auto-dialog>

//方法
loading.value = truenextTick(async () => {let res = await Pdf({ filePath: props.src }).catch(() => {})if (res) {//實例讀取文件對象const r = new FileReader()r.onload = function () {try {loading.value = false// this.result為FileReader獲取blob數據,如果返回報錯信息,則是正確的json數據,JSON.parse會正常轉換//如果返回文件流,則JSON.parse時會報錯,走catch代碼塊(進行正常的文件下載)const resData = JSON.parse(this.result)//resData是后端返回的json數據console.log(resData)if (resData.code !== 0) {ElMessage({message: resData.msg,type: "error"})return}} catch (error) {var binaryData = []binaryData.push(res)console.log(binaryData, "------------------------+++binaryData1111111111111111")let url = window.URL.createObjectURL(new Blob(binaryData, {type: "application/pdf"}))showPdf.value = trueloading.value = falsepdfSrc.value ="/pdf/web/viewer.html?file=" +encodeURIComponent(url) +"&myTime=" +new Date().getTime()}}r.readAsText(res)}})