3
6

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 3 years have passed since last update.

【初心者でもわかる】右クリックを禁止させる方法

Posted at

#どうも7noteです。右クリックを禁止させる方法をまとめました

・画像を保存させたくない
・クリック操作でコピペをさせたくない
・右クリックでソースをみられたくない

理由はいろいろあるかと思いますが、1行で簡単に右クリックを禁止させる方法をご紹介。
逆に右クリック禁止のサイトで禁止を解除する方法についてまとめた記事も最後に紹介しています。

右クリック禁止にする方法

「サイト全体を右クリック禁止にする」

index.html
<body oncontextmenu="return false;">
〜〜省略〜〜
</body>

bodyタグにoncontextmenu="return false;"を追加してください。
これだけでサイト全体を右クリック禁止にできます。

「特定の画像を右クリック禁止にする」

index.html
<img src="画像のURL" oncontextmenu="return false;">

こんどはimgタグにoncontextmenu="return false;"を追加してください。
これでサイト全体ではなく、画像に対してだけ右クリック禁止をかけることができます。

そもそも右クリック禁止にするメリットとデメリット

メリット

・簡単に画像をコピーさせたりできなくする
・設定が簡単

デメリット(というよりメリットの裏返し)

・右クリックの禁止だけでは、完全に画像コピーなどを防ぐことはできない
・設定が簡単だからこそ、知識がある人には容易に破られてしまう
・引用して画像を使ってもらうのをOKとしていた場合は逆に不親切。

このようにメリットとデメリットは常に一緒になって付いてくるので無理に対策をいれても対応できる範囲は限られています。
ですがwebにそこまで知識の無い方が乱用するような使われ方を防ぐには多少効果があるかもしれませんので、対策したい人は指定していて損はないのかなと思います。

クリック禁止を禁止させる方法

指定されているjavascriptを無効化させる方法もあるようですので合わせて紹介しておきます。

まとめ

右クリックの禁止は簡単に設定できるので、画像のコピペなどをされたくない人は入れておいていいのかなと思います。
ただ、他の方法で画像は簡単に取り出すことができるので、完全に防ぐのは難しいと思います。
そもそもネットに公開しているものなので、完璧に取られないようにする方が難しいのかも。
あくまで使われても、「こちらが先に情報開示したものです、マスターデータですよ」と証明できるようなサイトの作りにしておくほうが、そういう対策としては正しいのかもしれませんね。

おそまつ!

~ Qiitaで毎日投稿中!! ~
【初心者向け】WEB制作のちょいテク詰め合わせ

3
6
1

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
3
6

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?