登録日:
2025-02-16
最終更新日:
2025-03-21
サイトから画像をダウンロードさせない方法
サイトから画像をダウンロードさせないためには、いくつかの対策を組み合わせるのが効果的です。 ただし完全に防ぐことは難しく、スクリーンショットなどで取得される可能性はあります。 以下の方法を試してみてください。
右クリック禁止
JavaScriptを使って右クリックメニューを無効にする。
<script>
document.addEventListener('contextmenu', function(event) {
event.preventDefault();
});
</script>
デメリット:JavaScriptを無効にされたり、開発者ツールを使われると回避される。
画像のドラッグ&ドロップ禁止
CSSを使って画像のドラッグを無効にする。
img {
pointer-events: none;
-webkit-user-drag: none;
}
デメリット:ブラウザの開発者ツールを使えば回避可能。
画像の上に透明レイヤーを置く
画像の上に透明な div を重ねて、画像を直接クリックできないようにする。
<div style="position: relative; display: inline-block;">
<img src="image.jpg" alt="Protected Image">
<div style="position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: transparent;">
</div>
</div>
デメリット:開発者ツールでdivを削除されると回避可能。
画像をCSSの背景に設定
.protected-image {
background-image: url('image.jpg');
width: 300px;
height: 200px;
background-size: cover;
}
デメリット:CSSのソースコードを解析されると画像URLが分かる。
画像を分割して表示
大きな画像を複数の小さな画像に分割し、それらをCSSで組み合わせて表示する。 デメリット:手間がかかるが、スクリーンショットには無効。
透かし(ウォーターマーク)を入れる
画像にサイト名やロゴなどの透かしを入れておく。 デメリット:画像編集ソフトで消される可能性があるが、抑止力にはなる。
JavaScriptで画像を暗号化
画像データをBase64エンコードし、JavaScriptでデコードして表示する。 デメリット:ページの読み込み速度が遅くなり、開発者ツールを使えば復元可能。
サーバー側でリファラーチェックを行う
.htaccessやサーバーの設定で、自サイト以外から画像に直接アクセスできないようにする。
RewriteEngine on
RewriteCond %{HTTP_REFERER} !^https://yourwebsite.com/ [NC]
RewriteRule \.(jpg|jpeg|png|gif)$ - [F]
デメリット:開発者ツールで画像を直接取得される可能性がある。
CDNのホットリンク防止機能を使う
CloudflareなどのCDNを利用すると、ホットリンク(外部サイトからの直接リンク)を防ぐ機能がある。