如何使用 pdf.js 使 PDF 不可下载

Question

我找到了pdf.js项目，非常有用。 但是，我无法弄清楚如何删除“下载”选项。

Answer 1

只是删除按钮会破坏 pdf.js。 您需要为它们添加一个“隐藏”类（ https://github.com/mozilla/pdf.js/issues/2611 ）

Answer 2

只需在viewer.css中添加这个

.download
{
    display:none !important;    
}

.print
{
    display:none !important;
}

Answer 3

以下是步骤：

1. 将 jQuery 库添加到共享文件夹。
2. 将 jQuery 库包含到 viewer.html 文件中

3. 在标题部分添加以下内容：

    <script> $(function(){ $('#download').hide(); }); </script>

完毕！

Answer 4

修改源码。 web/viewer.html 的第 85 行。

https://github.com/andreasgal/pdf.js/blob/master/web/viewer.html#L85

只需取下按钮即可。

  <button id="download" title="Download" onclick="PDFView.download();" oncontextmenu="return false;">
    <img src="images/download.svg" align="top" height="16"/>
    Download
  </button>

这不会完全阻止有经验和渴望的用户下载它。 你永远无法阻止。 但这足以提高好奇心的标准。

Answer 5

另一种方法实际上看起来是使用pdf.customise.js （与它捆绑在一起的 WordPress 插件就是这样做的）。 我这样做是为了删除 openFile 按钮。

首先，在viewer.html ，添加：

<script src="pdf.customise.js"></script>

然后，让你的pdf.customise.js像这样：

(function($) {
    $(document).ready(function() {
        var params = window.location.search.substring(1).split("&");
        var disabledownload = false;
        var disableprint = false;
        var disabletext = false;
        var disabledoc = false;
        var disableopen = true;
        for (var i = 0; i < params.length; i++) {
            var value = params[i].split("=");
            if (value && value.length == 2)
                if (value[0] == "disabledownload" && value[1] == 1) disabledownload = 1;
                else if (value[0] == "disableprint" && value[1] == 1) disableprint = 1;
            else if (value[0] == "disabletext" && value[1] == 1) disabletext = 1;
            else if (value[0] == "disabledoc" && value[1] ==
                1) disabledoc = 1
        }
        var extracss = "";
        if (disabledownload) extracss += " .download {display:none!important;}";
        if (disableprint) extracss += " .print {display:none!important;}";
        if (disabletext) extracss += " .textLayer {-webkit-touch-callout: none !important; -webkit-user-select: none !important; -khtml-user-select: none !important; -moz-user-select: none !important; -ms-user-select: none !important; user-select: none !important;} .selectTool { display: none !important;}";
        if (disabledoc) extracss += " #documentProperties {display:none !important;}";
        if (disableopen) extracss += " #openFile { display:none!important;}";
        if (disableopen) extracss += " #secondaryOpenFile { display:none!important;}";
        if (extracss) {
            var style = document.createElement("style");
            style.type = "text/css";
            style.innerHTML = extracss;
            document.getElementsByTagName("head")[0].appendChild(style)
        }
        $(document).bind("pagerendered", function(e) {
            if (disabledownload) $(".download").remove();
            if (disableprint) $(".print").remove();
            if (disableopen) $("#openFile").remove();
            if (disableopen) $("#secondaryOpenFile").remove();
            if (disabletext) {
                $(".selectTool").remove();
                $(".textLayer").remove();
                if (PDFViewerApplication) PDFViewerApplication.pdfCursorTools.switchTool(1)
            }
            if (disabledoc) {
                $(".documentProperties").prev(".horizontalToolbarSeparator").remove();
                $(".documentProperties").remove()
            }
        })
    })
})(jQuery);

我不喜欢这使用 jQuery 而不是纯 javascript（但是它可以很容易地以这种方式重写），但仍然工作得很好。

Answer 6

最简单的方法是在工具栏中的特定按钮（本例中为下载按钮）中添加hidden类

PDF.JS 在其 CSS 文件中默认包含隐藏类。 因此，只需向具有 id download和secondaryDownload的按钮添加一个hidden类

Answer 7

将此添加到 viewer.css：

隐藏下载图标：

.toolbarButton.download {
    display: none;
}

隐藏打印机图标...

.toolbarButton.download {
    display: none;
}

对于两者...

.toolbarButton.download, .toolbarButton.print {
    display: none;
}

Answer 8

你可以试试这个https://github.com/latuminggi/pdf.js_readonly

这也可以防止用户使用 Ctrl + S 或 Ctrl + P 等快捷方式

Answer 9

在 viewer.js 中找到 download() 并将 return false; 在最顶端。 如果您还想禁用打印，请对 beforePrint()、afterPrint() 和 performPrint() 执行相同操作。

然后，您可以使用 css 等方式隐藏按钮。

查看器.js

async download() {
    return false;
}
beforePrint() {
    return false;
}
afterPrint() {
    return false;
}
performPrint() {
    return false;
}