私自身はあまりおすすめしない「コピペ禁止サイト」ですが、よく方法を聞かれます。
一定の需要はあるんだなと感じますので、プログラムコードを紹介します。
「右クリック」も「コピー(Ctrl + c)」も「F12(デベロッパーツール)」も防ぐ強固な手法です。
100%防ぐことはできませんが、90%くらいは対策できると思います。
右クリックを禁止するコード
コンテキストメニューといいますが、メニューの中に「コピー」や「ページのソースを表示」などがありますが、この項目を選択できないようにします。
bodyタグにオプションoncontextmenuを設定します。
<body oncontextmenu="return false">JavaScriptのコードは下記です。
document.oncontextmenu = () => {
alert('右クリック禁止'); // 右クリック時にアラートを出す
return false;
}
右クリック時にアラートを出すことができます。
文字を選択させない
コピーをするときにコピー範囲を選択すると思います。
範囲選択を禁止する方法です。
bodyタグにonmousedownを設定します。
<body onmousedown="return false">CSSで対策するなら下記になります。
body {
user-select: none;
}
これでコピー範囲を選択することができなくなるので、コピー対策になります。
コピーの禁止
コンテキストメニューからコピーを選んだり、「Ctrl + C」でのコピーを禁止する対策です。
bodyタグにoncopyを設定します。
<body oncopy="return false">JavaScriptのコードは下記です。
document.oncopy = () => {
alert('コピーはダメです'); // 「Ctrl + c」コピー時にアラートを出す
return false;
}
F12を禁止する
ChromeやEdgeなどのブラウザを使用時に「F12」を押すと開発者ツール(デベロッパーツール)が開きます。
HTMLが表示されるのでそこからコピーする強者も存在します。
JavaScriptで「F12」も対策します。
document.addEventListener('keydown', e => {
if (e.keyCode == 123) e.preventDefault(); // 123:F12キーのコード、e.keyでF12を指定もあり
});
押したキーを判定してF12なら無効にするJavaScriptです。
同様のやり方で「Ctrl + U」の「ソースを表示する」も対策できます。(Ctrlキーを無効にする)
回避策
JavaScriptを無効にされるとコピーできてしまいます。
CSSの「user-select: none;」は効果あるので範囲選択ができないのでコピーは面倒ですが。
CSSも無効にされると打つ手なしです。
ただ、JavaScript無効もCSS無効も面倒くさいので、そこまでしてコピーしたいのかは微妙ですが。。
まとめ
当サイトではコピペを禁止にはしません。
ただし転載を許可しているわけではありません、禁止です。（ここ重要）
プログラムコードを1文字ずつ手打ちするのも大変なのでコピーブロックはしないです。
優しさです、私はバファリンの次にやさしいのです。
誰もがコピーして参考にしたくなる、そんな技術サイトになればいいなと思います。