PDF.jsでユーザがPDFを保存できなくする方法

2021.08.23
Linux

はじめに

PDFをWebで公開するとき、クライアントにPDFをダウンロードさせたくないことがあると思います。
そのような場合にPDF.jsが使えることが分かったので設定方法などを紹介します。
今回はPDF.jsのソースを修正して、右クリック禁止や印刷・保存禁止などの設定を行っています。

環境

- PDF.js Stable ver.2.6.347
- Apache 2.4.38
- Debian buster 64bit

ファイル構成

view.html
pdf
  ┣ --test.pdf
js
  ┣ -- pdfjs
          ┣ -- build
          ┣ -- web

設置方法

1. pdfjsをダウンロードして解凍します。

PDF.js
A general-purpose, web standards-based platform for parsing and rendering PDFs.
mozilla.github.io

2. HTMLファイルと同じ階層に「js/pdfjs」ディレクトリを作成して「build」と「web」ディレクトリをコピーします。

3. PDFファイルはHTMLファイルと同じ階層に「pdf」ディレクトリを作成してコピーします。 

sudo mkdir -p /home/www/html/js/pdfjs
sudo cp -r ~/pdfj2.4.38-dist/build /home/www/html/js/pdfjs
sudo cp -r ~/pdfj2.4.38-dist/web /home/www/html/js/pdfjs
sudo chown -R www-data.www-data /home/www/html/js

ls -la
   drwxr-xr-x 4 www-data www-data  4096  2月 21 21:46 .
   drwxr-xr-x 6 www-data www-data  4096  2月 21 21:44 ..
   drwxr-xr-x 3 www-data www-data  4096  2月 21 21:45 js
   drwxr-xr-x 2 www-data www-data  4096  2月 21 21:04 pdf
   -rwxr--r-- 1 www-data www-data 11131  2月 21 21:35 view.html

HTMLファイル

表示するPDFへのリンクを以下のように記述します。

<a href="js/pdfjs/web/viewer.html?file=../../../pdf/test.pdf">タイトル</a>

PDF.jsのソース修正

「viewer.css」と「viewer.js」を修正します。

PDFを表示したときに右クリックを禁止

「pdfjs/web/viewer.css」の末尾に以下を記載します。

.toolbar {
    display: none;
}

#viewerContainer {
    top: 0;
}

@media print {
    body {
        display: none;
    }
}

保存ショートカットキーコード「83」を無効

「pdfjs/web/viewer.js」の2716行目あたりを「//」でコメントします。
コメントすることで「Ctrl+S」で保存することを禁止します。
保存ダイアログでファイルが表示されますがPDF本体は保存できません。

  if (cmd === 1 || cmd === 8) {
    switch (evt.keyCode) {
      case 83:
        //eventBus.dispatch("download", {
        //  source: window
        //});
        //handled = true;
        break;

2859行目あたりを「//」でコメントします。

      case 83:
        //PDFViewerApplication.pdfCursorTools.switchTool(_pdf_cursor_tools.CursorTool.SELECT);
        break;

印刷ショートカットキーコード「80」を無効

「pdfjs/web/viewer.js」の2736行目あたりを「//」でコメントします。
コメントすることで「Ctrl+P」で印刷することを禁止します。
印刷プレビューでは白紙が表示されます。

  if (cmd === 3 || cmd === 10) {
    switch (evt.keyCode) {
      case 80:
        //PDFViewerApplication.requestPresentationMode();
        //handled = true;
        //handled = false;
        break;

URLの直打ち対策

上記の方法ではPDFファイルのURL、例えば「https://aaa.bbb.cc/pdf/test.pdf」と直打ちすると保存できます。
以下の設定を「.htaccess」に記述してPDFファイルが置いてあるディレクトリに置けば直リンクを制限できますがWebブラウザの設定やサーバの設定によっては効かない場合があります。
「https://aaa\.bbb\.cc」のように、ドットの前には「\」を挿入します。

<FilesMatch "\.(pdf|PDF)$">
    SetEnvIf Referer "^https://aaa\.bbb\.cc" referer_ok
    #<RequireAny>
        Require all denied
        Require env referer_ok
    #<RequireAny>
</FilesMatch>

「.htaccess」を有効にするにはAapcheの設定も必要。
「AllowOverride All」を記述します。

<Directory /home/www/html/>
    AllowOverride All
    以下、略。
</Directory>

Comments