PDFJS实现PDF转图片

该篇文章介绍了一种利用JavaScript库PDF.js将PDF文档转换为canvas图片的方法,涉及引入库文件、创建DOM元素、渲染PDF页面到canvas并最终转换为base64图片的步骤。此过程解决了在浏览器端处理PDF并显示汉字的问题。

JavaScript本身不支持PDF转换为图片的功能。但可以使用PDF.js库来将PDF转换为canvas图片,此篇记录一种写法

pdf.js官网

示例(基于jquery,vue)
1.引入js库
引入压缩包build文件夹下pdf.js和pdf.worker.js,以及web文件夹下cmaps文件夹

<script src="../../js/plugin/pdfjs-3.6.172/pdf.js"></script>
<script src="../../js/plugin/pdfjs-3.6.172/pdf.worker.js"></script>

2.创建dom用于渲染

<img :src="imageUrl" class="w-full mb-1" alt="">
<canvas id="the-canvas" style="display: none"></canvas>

3.js方法

/**
 * @param {String} url 文件路径
 * */
previewPdf(url) {
   
   
    if (url) {
   
   
        let _this = this;
        let imgArr = [
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值