微信小程序实现PDF预览功能 |
您所在的位置：网站首页 › 微信上的pdf文件怎么编辑 › 微信小程序实现PDF预览功能 |
微信小程序实现PDF预览功能
|
文章目录
前言一、pdf.js 是什么？二、使用步骤1.下载库文件2.使用方式微信小程序端——使用 web-view 标签H5 端——使用 iframe 标签（使用vue框架）
3.更改源码如何隐藏顶部工具栏如何让用户强制阅读一定时间如何获取pdf总页数如何获取pdf当前页数将总页数和当前页数发送给小程序
总结
前言
前一段时间遇到了一个需求，关于 pdf 文件的预览，客户要求如下： 只能在微信小程序内预览，不能调起本地浏览器预览；需要让用户强制阅读 10s 后才算阅读完成，进而进行下一步操作；用户不能下载预览的 pdf 文件；因为一些原因（此处省略一万字🐎），这个项目具有 H5 端和原生微信小程序端，并且他们有着相同的业务逻辑😊，所以最好的办法就是设计出一套方案适用两端，前期做了一些尝试，可以看这篇文章，最后决定使用 pdf.js 来实现业务要求。 一、pdf.js 是什么？PDF.js 由 Mozilla 提供支持。目标是创建一个通用的、基于 Web 标准的平台，用于解析和呈现 PDF。 二、使用步骤 1.下载库文件前往 pdf.js 的 官网 下载库文件，我们下载哪个版本都是可以的，后者适用于旧版浏览器，我这里下载的后者。
下载完成后，因为微信小程序打包的限制，我将库文件放到腾讯云服务器上，如果想测试可以联系我提供测试资源。 H5 可以放到本地，目录如下：
通过web目录下 viewer.html 查看器 + pdf文件路径预览pdf文件 yourPath/web/viewer.html?file=pdfPath 微信小程序端——使用 web-view 标签代码示例： //.wxml |
【本文地址】
今日新闻 |
推荐新闻 |