美文网首页
vue-pdf踩坑,第二次打开空白,报错Cannot read

vue-pdf踩坑,第二次打开空白,报错Cannot read

作者: 依然_8deb | 来源:发表于2022-07-20 10:38 被阅读0次

    坑一:第二次打开空白

    原因:引入了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;
                }
    

    相关文章

      网友评论

          本文标题:vue-pdf踩坑,第二次打开空白,报错Cannot read

          本文链接:https://www.haomeiwen.com/subject/imduirtx.html