PC項目裏面使用pdf.js在線預覽pdf文件功能

時間 2019-12-12

標籤項目裏面使用 pdf.js pdf 在線預覽文件功能欄目 JavaScript 简体版

原文原文鏈接

1.一天PM找到我，客戶說了要實現一個在線預覽pdf文件的功能！並且要不能下載
2.我：？？？，沒作過啊，而後去搜索了一下，有一個pdf.js的開源項目
3.打開gitHub 找到該項目
gitHub地址：pdf.js
4.具體內容去看文檔，因爲項目是純html開發
5.這裏的直接用: https://pan.baidu.com/s/1GtEu... 提取碼: x875html

6.解壓後的文件

7.demogit

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<a href="generic/web/viewer.html?file=你的pdf文件地址 target="view_window">在線預覽pdfdemo</a>
</body>
</html>

8.去掉下載和打印按鈕
找到文件viewer.html如圖
github

隱藏打印和下載按鈕代碼web

#print {
  visibility: hidden;
}
#download {
  visibility: hidden;
}

禁止鼠標右鍵彈出（此方案只是隱藏了右鍵彈框，若是想下載仍是能夠下載的）

spa

<script>
        // 禁止鼠標右鍵保存打印
        document.oncontextmenu = function(ev){
            return false;
        };
    </script>

9.官方democode

10.完成！htm

相關標籤/搜索