vue-pdf踩坑,第二次打开空白,报错Cannot read
2022-07-20 本文已影响0人
依然_8deb
坑一:第二次打开空白
原因:引入了CMapReaderFactory.js解决PDF中文不显示的问题。
在你第一次加载PDF的时候,bcmap的返回值是Uint8Array[43366]的数组对象,而第二次预览PDF加载时bcmap的返回值是Uint8Array []的空数组,因为第二次加载时取的是初次加载PDF文件时的语言文件的loadModules的缓存,但是取的过程中导致了失败,返回了空值。
解决方案:在node_modules中找到vue-pdf,src下的CMapReaderFactory文件中增加以下代码:
delete require.cache[require.resolve('./buffer-loader!pdfjs-dist/cmaps/'+query.name+'.bcmap')];
整个CMapReaderFactory.js代码如下:
import { CMapCompressionType } from 'pdfjs-dist/es5/build/pdf.js'
// see https://github.com/mozilla/pdf.js/blob/628e70fbb5dea3b9066aa5c34cca70aaafef8db2/src/display/dom_utils.js#L64
export default function() {
this.fetch = function(query) {
return import('./buffer-loader!pdfjs-dist/cmaps/'+query.name+'.bcmap' /* webpackChunkName: "noprefetch-[request]" */)
.then(function(bcmap) {
delete require.cache[require.resolve('./buffer-loader!pdfjs-dist/cmaps/'+query.name+'.bcmap')];
return {
cMapData: bcmap.default,
compressionType: CMapCompressionType.BINARY,
};
});
}
};
坑二:打开pdf控制台报错Cannot read properties of undefined (reading 'catch')
解决方案:
在node_modules中找到vue-pdf,src下的pdfjsWrapper.js。将
if ( pdfRender !== null ) {
if ( canceling )
return;
canceling = true;
pdfRender.cancel().catch(function(err) {
emitEvent('error', err);
});
return;
}
修改为:
if ( pdfRender !== null ) {
if ( canceling )
return;
canceling = true;
pdfRender.cancel();
return;
}