移動端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就知道怎么用了，本地預覽不了，放到服務器上就可以）

預覽效果：

 

 

根據大家需求選擇預覽方式即可