|
@@ -1,4 +1,4 @@
|
|
|
-<!-- <template>
|
|
|
+<template>
|
|
|
<div class="pdf-view-example j-contanter">
|
|
|
<div id="pdf-view-container" class="j-main" />
|
|
|
<div v-if="!getUserId" class="j-footer">
|
|
@@ -16,10 +16,8 @@
|
|
|
|
|
|
<script>
|
|
|
import { mapGetters } from 'vuex'
|
|
|
-import * as pdfjsLib from 'pdfjs-dist/build/pdf'
|
|
|
import AdSingle from '@/components/ad/Ad'
|
|
|
import { getAssetsFile } from '@/utils'
|
|
|
-import 'pdfjs-dist/build/pdf.worker.mjs'
|
|
|
|
|
|
export default {
|
|
|
name: 'PdfViewExample',
|
|
@@ -32,7 +30,16 @@ export default {
|
|
|
pdf: null,
|
|
|
totalPages: 0,
|
|
|
currentPage: 1, // 新增
|
|
|
- batchSize: 5 // 新增
|
|
|
+ batchSize: 5, // 新增
|
|
|
+ config: {
|
|
|
+ PAGE_TO_VIEW: 0,
|
|
|
+ SCALE: 1.0,
|
|
|
+ CMAP_URL:
|
|
|
+ 'https://cdn-common.jianyu360.com/cdn/lib/pdfjs-dist/2.1.266/cmaps/',
|
|
|
+ CMAP_PACKED: true,
|
|
|
+ workerSrc:
|
|
|
+ 'https://cdn-common.jianyu360.com/cdn/lib/pdfjs-dist/2.1.266/build/pdf.worker.min.js'
|
|
|
+ }
|
|
|
}
|
|
|
},
|
|
|
computed: {
|
|
@@ -65,11 +72,13 @@ export default {
|
|
|
async loadPdf(pdfUrl, container) {
|
|
|
console.log('pdfUrl', pdfUrl)
|
|
|
try {
|
|
|
+ pdfjsLib.GlobalWorkerOptions.workerSrc = this.config.workerSrc
|
|
|
const loadingTask = pdfjsLib.getDocument({
|
|
|
url: pdfUrl,
|
|
|
+ cMapUrl: this.config.CMAP_URL,
|
|
|
+ cMapPacked: this.config.CMAP_PACKED,
|
|
|
disableRange: true,
|
|
|
disableAutoFetch: false, // 启动自动分块加载
|
|
|
- workerSrc: 'pdfjs-dist/build/pdf.worker.mjs',
|
|
|
// 添加缓存头
|
|
|
httpHeaders: {
|
|
|
'Cache-Control': 'max-age=3600' // 缓存 1 小时
|
|
@@ -79,7 +88,6 @@ export default {
|
|
|
// 减少初始加载的字节数,提高初始加载速度
|
|
|
initialDataSize: 1024 * 1024
|
|
|
})
|
|
|
- pdfjsLib.GlobalWorkerOptions.workerSrc = 'pdfjs-dist/build/pdf.worker.mjs'
|
|
|
this.pdf = await loadingTask.promise
|
|
|
this.totalPages = this.pdf.numPages
|
|
|
this.currentPage = 1
|
|
@@ -131,4 +139,4 @@ export default {
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
-</script> -->
|
|
|
+</script>
|