フリーランス|WEB 制作経験丸7年、制作会社様からのご依頼に丁寧・高クオリティでお手伝いいたします。 IRODORI DESIGN

B L O G

【JavaScript】右クリックを禁止する方法

JavaScript
右クリック禁止

ブラウザ上で右クリックすることで、ブラウザの便利な機能を活用することが出来ます。
しかし、その中には画像を保存するなど、悪用されかねない機能も存在します。このような悪用を防ぐために、右クリックを禁止する方法があります。
右クリックを禁止することは比較的簡単ですが、その際にはデメリットが多く考えられます。

この記事では、ブラウザで右クリックを禁止する方法とともに、右クリックを禁止する際の注意点についてもご紹介します。

JavaScriptで右クリックを禁止する方法

JavaScriptを使って右クリックを禁止するには以下のコードで実現することが出来ます。コピペですぐに使うことが出来ます。

window.onload = function() {
    document.addEventListener('contextmenu', function(e) {
        e.preventDefault();
    });
};

See the Pen Untitled by 寺井大樹 (@teraisan) on CodePen.

右クリック禁止を導入する場面とは?

右クリック禁止は画像やテキストの不正コピーを防ぐために一般的に使用されますが、この右クリック禁止は簡単に突破出来てしまいます。
そのため、右クリック禁止はセキュリティ対策としてではなく、主に一般的なユーザーに対する抑止力として考えられる場合が多いです。

実装時の注意事項

JavaScriptで右クリックを禁止する時、注意する点がいくつかあります。

ブラウザ機能の制限

通常、右クリックはブラウザの便利な機能を利用するために使用されます。右クリックを禁止すると、これらの機能が制限され、ユーザーが不便を感じる可能性があります。

JavaScriptの有効性に依存

右クリックの禁止はJavaScriptによって実装されます。
しかし、ブラウザでJavaScriptを無効にすることが出来るため、JavaScriptを無効にしているユーザーは通常通り右クリックを行うことが出来ます。

まとめ

いかがでしたか?
右クリックを禁止することは、一部のユーザーにとっては気休め程度であり、逆に不便に感じることもあるかもしれません。
実際に、本当に右クリックを禁止してしまってもよいのか、実装する前に慎重に検討することが重要です。