移动端pdf在线预览，使用pdf.js插件实现

（一）、pdf.js 进行pdf预览

1.  先下载pdf.js 插件:https://files.cnblogs.com/files/liangziaha/pdf.7z

官网地址：https://mozilla.github.io/pdf.js/getting_started/#download（pdf.js）

git地址：https://github.com/mozilla/pdf.js（pdf.js）

2.先展示一下预览效果

3.这里我们使用的 layui的弹出层模块进行弹出预览pdf（这里layer 弹出层怎么使用就不记录了，自己去官网搜吧）

在引入layui之后，我们下载的pdf文件放到我们的项目下，可以创建一个js文件，放到此文件下

4.这时我们使用pdf在线预览时，可以使用layer 弹出 iframe 层的方法进行pdf预览

// pdf在线预览
    function showFile(url) {
        layer.open({
            type: 1,
            title: "信息(点击“+”号放大查看条款)",
            area: ["100%", "100%"], //宽高
            content:
                "<iframe src='./js/pdf/web/viewer.html?file=" +
                url +
                "' style='width:100%;height:100%'></iframe>"
        });
    }

注意：这里的 iframe 的src路径为 你下载的pdf 文件的相对路径，url是你的pdf地址

5.这里在本地预览可能会遇到跨域的问题，放到服务器上就可以正常预览pdf

（二）、h5pdf.js

git地址：https://gitee.com/pjjg/pdfh5 （下载先来打开Demo就知道怎么用了，本地预览不了，放到服务器上就可以）

预览效果：

 

 

根据大家需求选择预览方式即可