PDFビュワーはPDF.jsを使用します。
PDF.js
各ファイルやセッティングは各自調べてみて下さい
ファイルを解凍して「viewer.html」を実行すればブラウザ上でPDFが見れる事を確認できます。
※最新版にしたところIE11でエラーとなり表示できなくなっています。
どちらで作るか悩みましたが最新版で作業をおこないます。
(旧版が手に入らない可能性も含め)
PDFのサンプルが表示されていると思いますが初期に表示させたくないので
viewer.js 3573行目
value: "compressed.tracemonkey-pldi-09.pdf",
を
value: "",
として下さい
対象となるPDFは事前準備としてBASE64テキストに変換
WindowsでBase64エンコード/デコードする方法
certutil -f -encode "input.pdf" "output.txt"
今回はJSファイルに偽装しました。
BASE64テキスト変換したファイルをテキストエディタで開いて
text
1-----BEGIN CERTIFICATE-----
2JVBERi0xLjcKC ...
3... ZWYKNDkyCiUlRU9G
4-----END CERTIFICATE-----
1行目 "-----BEGIN CERTIFICATE-----" を var datamap = '
最終行 "-----END CERTIFICATE-----" を ';
に変え改行をすべて削除
text
1var datamap = 'JVBERi0xLjcKC ... ZWYKNDkyCiUlRU9G';
この辺りはWebの場合なら
JavaScriptでcsv読み込み
のようにして無加工BASE64形式でファイルを読む仕組みでも構いません。
(ローカルで済ませたくてこの様な形にしているだけです)
後は「viewer.html」のヘッダ部分に以下を追加
※ 今回判りやすくヘッダ記載としていますが、実際使う際はJSファイルの「圧縮・難読化」した状態として下さい。
HTML
1 <script src="test.js"></script> <!-- 偽装したPDFファイル -->
2
3 <script type="text/javascript">
4 var overlay;
5 window.onload= function(){
6 let el;
7 el = document.getElementById("openFile");
8 el.parentNode.removeChild(el);
9 el = document.getElementById("print");
10 el.parentNode.removeChild(el);
11 el = document.getElementById("download");
12 el.parentNode.removeChild(el);
13 overlay = document.createElement('div');
14 overlay.id = 'overlay';
15 overlay.style.position = 'absolute';
16 overlay.style.left = "0";
17 overlay.style.top = "0";
18 overlay.style.width = "100%";
19 overlay.style.height = "100%";
20 overlay.style.background = "rgba(64, 64, 64, 0.99)";
21 overlay.style.zIndex = "2147483647";
22 overlay.style.display = "none";
23 document.body.appendChild(overlay);
24 el = document.createElement('style');
25 el.type = "text/css";
26 document.head.appendChild(el);
27 document.styleSheets.item( document.styleSheets.length - 1).insertRule(" * { -webkit-touch-callout: none !important; -webkit-user-select: none !important; -moz-user-select: none !important; -ms-user-select: none !important; user-select: none !important;}", 0);
28 document.styleSheets.item( document.styleSheets.length - 1).insertRule("@media print { body { display: none !important; } }", 0);
29 document.onselectstart = function(){return false;}
30 document.oncontextmenu = function(){return false;}
31 document.ondragstart = function(){return false;}
32 document.oncopy = function(){return false;}
33 document.onMouseDown = function(){return false;}
34 window.addEventListener('blur', function(){ overlay.style.display = ""; });
35 window.addEventListener('focus', function(){ overlay.style.display = "none"; });
36 window.addEventListener("keydown", function(e){
37 if(e.ctrlKey || e.altKey || e.keyCode == 91) overlay.style.display = "";
38 });
39 window.addEventListener("keyup", function(e){
40 if(!e.ctrlKey && !e.altKey) overlay.style.display = "none";
41 if(e.keyCode == 44 || e.keyCode == 91){
42 try { navigator.clipboard.writeText(''); } catch (error) {}
43 }
44 });
45
46 PDFViewerApplication.open(loadData(datamap));
47 function loadData(d) {
48 var raw = atob(d);
49 var uint8Array = new Uint8Array(new ArrayBuffer(raw.length));
50 for (var i = 0, len = raw.length; i < len; ++i) {
51 uint8Array[i] = raw.charCodeAt(i);
52 }
53 return uint8Array;
54 }
55 }
56 </script>
コメント残そうかとも思ったんですが
せっかくのセキュリティ台無しになりそうなのでやめておきます。
確認ブラウザ(windows 64bit)
- IE11 (PDF.js最新版だとエラーが発生して使えず)
- Firefox 81.0.1
- Chrome 86.0.4240.75
- Edge 86.0.622.38
確認用サイトも準備しようとしたのですが、必要ないとの事なので行っていません。
もし必要ならおっしゃって下さい。
ただ先にも書きましたが、開発コンソールから追いかければ文字自体は取得できてしまいます。
(ただし文字の位置や画像までとなると相当大変ですが)
以上が「PDFを印刷・ダウンロード・プリントスクリーンさせず表示する方法」となります。
追記
※ プリントスクリーンの対策がアクティブウインドウ時のみだった為処理を追加
追記2
しばらくは残しておきますが時間がたてば消します。
PDF.js viewer(対策版)
PDF.js viewer(未対策版)
※ 未対策版はPDFを表示後読み込ませて下さい。
追記3
一部ノートパソコンでのプリントスクリーンに対応