はじめに
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をダウンロードして解凍します。
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