html使用pdfjs在线查看pdf

⌚Time: 2024-04-14 13:20:00

👨‍💻Author: Jack Ge

不同浏览器对于pdf打开和查看的方式不一样。使用webjs可以让浏览器统一的阅读pdf文档。pdfjs是火狐开发的pdf阅读器

下载地址:https://mozilla.github.io/pdf.js/

下载后解压。在他的web/目录下哟i一个viewer.html文件,用到的就是它。使用方法很简单。打开这个网页,传入pdf文件的路径就行了。

<a href="../pdfjs/web/viewer.html?file=../files/books/Linux/UNIX网络编程第1卷.pdf">UNIX网络编程第1卷.pdf</a>

点击后这个链接就能够打开并且阅读pdf文件。

工具栏上默认很多按钮。如果想禁止用户下载,打印等操作。可以隐藏相关按钮。 编辑viewer.html,将工具栏上的按钮隐藏

    <style type="text/css">
    .openFile {
      display: none;
    }
    .print {
      display: none;
    }
    .download {
      display: none;
    }
    </style>

删除其中的几行,这是更多菜单里的


            <button id="secondaryOpenFile" class="secondaryToolbarButton openFile visibleLargeView" title="Open File" tabindex="52" data-l10n-id="open_file">
              <span data-l10n-id="open_file_label">Open</span>
            </button>

            <button id="secondaryPrint" class="secondaryToolbarButton print visibleMediumView" title="Print" tabindex="53" data-l10n-id="print">
              <span data-l10n-id="print_label">Print</span>
            </button>

            <button id="secondaryDownload" class="secondaryToolbarButton download visibleMediumView" title="Download" tabindex="54" data-l10n-id="download">
              <span data-l10n-id="download_label">Download</span>
            </button>

所以现在在工具栏上和更多菜单里都不会有下载、打印和打开本地文件的按钮了