PDF.js 入门指南

简介

PDF.js是一个用于在网页中显示PDF文档的JavaScript库。它是由Mozilla开发的，是一个完全免费、开源的工具。在本篇文章中，我们将详细介绍如何使用PDF.js进行前端开发，包括基本的使用方法、代码示例以及一些实用的技巧。

官网地址:https://mozilla.github.io/pdf.js/

 安装方式:

1.通过npm安装如下

npm install pdfjs-dist

2.通过官网地址 手动下载

 vue3 引入方式:(其他方式自行测试)

import * as PDFJS from 'pdfjs-dist'
const workerSrc = require('pdfjs-dist/build/pdf.worker.entry')
PDFJS.GlobalWorkerOptions.workerSrc = workerSrc

组件中使用方式:

HTML层:

<template>
    <div id="container">
        <canvas id="pdf-canvas"></canvas>
    </div>
</template>

script层:

PDFJS.getDocument({
        url,
        cMapPacked: true
    }).promise.then((pdf) => {
       
    }, (err) => {
        console.log(err)
        // 其他 error
        if (err.name === 'MissingPDFException') {
            ElMessage.error('无效的PDF链接')
        }
    })

作者所用版本:"pdfjs-dist": "^2.13.216"