qymljy 7 месяцев назад
Родитель
Сommit
fd6e4906d2
1 измененных файлов с 31 добавлено и 16 удалено
  1. 31 16
      src/components/preview/pdfViewer.vue

+ 31 - 16
src/components/preview/pdfViewer.vue

@@ -7,8 +7,16 @@
 </template>
 
 <script>
-import { getDocument } from 'pdfjs-dist/build/pdf'; // 用于加载文档
+// import { getDocument } from 'pdfjs-dist/build/pdf'; // 用于加载文档
 import * as pdfjsLib from 'pdfjs-dist/web/pdf_viewer'; // 获取全局配置接口
+import { getDocument, GlobalWorkerOptions } from 'pdfjs-dist/build/pdf';
+import workerBundle from 'pdfjs-dist/build/pdf.worker.entry';
+
+// ✅ 关键配置:显式设置Worker路径并启用中文字体支持
+GlobalWorkerOptions.workerSrc = workerBundle.default;
+GlobalWorkerOptions.cMapUrl = 'https://cdnjs.cloudflare.com/ajax/libs/pdf.js/2.11.338/cmaps/';
+GlobalWorkerOptions.cMapPacked = true;
+
 export default {
   name: "pdfViewer",
   // props: {
@@ -25,25 +33,32 @@ export default {
   },
   async mounted() {
     try {
-      // ✅ 关键步骤:动态加载 Worker 脚本并设置路径
-      const workerBundle = await import('pdfjs-dist/build/pdf.worker.entry');
-      pdfjsLib.GlobalWorkerOptions.workerSrc = workerBundle.default;
-
-      // 可选:配置中文字体支持(解决乱码问题)
-      pdfjsLib.GlobalWorkerOptions.cMapUrl = 'https://cdnjs.cloudflare.com/ajax/libs/pdf.js/2.11.338/cmaps/';
-      pdfjsLib.GlobalWorkerOptions.cMapPacked = true;
-
-      // 发起文档加载请求
-      console.log(this.src,'src浏览的地址内容')
       const docPromise = getDocument({ url: this.src, withCredentials: true });
       this.pdfDoc = await docPromise.promise;
-      await this.renderPage(this.pageNum); // 触发渲染
-      this.loading = false;
+      await this.renderPage(1); // 默认加载第一页
     } catch (err) {
-      console.error("PDF初始化失败:", err);
-      this.errorMsg = `无法加载PDF文件 (${err.message})`;
-      this.loading = false;
+      console.error("PDF加载失败:", err); // 此处应能捕获到具体的错误堆栈
     }
+    // try {
+    //   // ✅ 关键步骤:动态加载 Worker 脚本并设置路径
+    //   const workerBundle = await import('pdfjs-dist/build/pdf.worker.entry');
+    //   pdfjsLib.GlobalWorkerOptions.workerSrc = workerBundle.default;
+    //
+    //   // 可选:配置中文字体支持(解决乱码问题)
+    //   pdfjsLib.GlobalWorkerOptions.cMapUrl = 'https://cdnjs.cloudflare.com/ajax/libs/pdf.js/2.11.338/cmaps/';
+    //   pdfjsLib.GlobalWorkerOptions.cMapPacked = true;
+    //
+    //   // 发起文档加载请求
+    //   console.log(this.src,'src浏览的地址内容')
+    //   const docPromise = getDocument({ url: this.src, withCredentials: true });
+    //   this.pdfDoc = await docPromise.promise;
+    //   await this.renderPage(this.pageNum); // 触发渲染
+    //   this.loading = false;
+    // } catch (err) {
+    //   console.error("PDF初始化失败:", err);
+    //   this.errorMsg = `无法加载PDF文件 (${err.message})`;
+    //   this.loading = false;
+    // }
   },
   methods:{
     async loadNewDocument(newSrc) { // 新增的核心方法!