JavaScript

Javascript

画像 右クリックでのダウンロードは禁止!!

普段物件画像を取り扱うシステムを構築することが多いんですが、

不動産会社さんにとって画像は大事な資源です。

 

ということで、

マウスの右クリックでの画像ダウンロードを禁止したい!!

という要望があり早速対応してみることに。

setAttribute('oncontextmenu', 'return(brc2());');
function brc2(){
 return(false);
}

というJavascriptコードを作成して、

テスト開始!!

 

Firefox => OK
chrome => OK
IE8 => OK

 

ところが、IE6では動作してくれません。

更にIE7とOperaでも同様の現象が!!!!!!!!

 

早速調べてみると、

なんとsetAttribute()関数はIE6、IE7、Operaでは動作してくれないと事でした。

これはIE6、IE7のバグとして有名らしいです。

 

仕方ないので、

ブラウザの判定を行なってブラウザによって処理を変更するように修正しました。

var userAgent = window.navigator.userAgent.toLowerCase();
var appVersion = window.navigator.appVersion.toLowerCase();

if(userAgent.indexOf('opera') != -1){
 self._img.oncontextmenu=brc2;
}else if(userAgent.indexOf("msie") != -1){
 if(appVersion.indexOf("msie 6.") != -1 || appVersion.indexOf("msie 7.") != -1){
  self._img.oncontextmenu=brc2;
 }else{
  //IE8以降
  self._img.setAttribute('oncontextmenu', 'return(brc2());');
 }
}else{
 self._img.setAttribute('oncontextmenu', 'return(brc2());');
}

function brc2(){
 return(false);
}

こんな感じです。

 

このソース、もうちょっとスマートに出来そうですが、

今回は取り敢えず動作してくれればOKなんで、

そこは我慢!!

 

因みに、ブラウザの判定は

http://d.hatena.ne.jp/Naotsugu/20110927/1317140891

のサイトを参考にさせて頂きました。

 

本当は、

<img src="画像パス" oncontextmenu="return(false);">

といったように<img>タグに「oncontextmenu="return(false);"」を記述するだけでいいはずなんですが、

ちょっと特別な記述をしてみたかったんで、

今回は敢えてこんな複雑な処理にしてみました。

 

ただ、これは気休め程度の処理と思ってください。

ブラウザ上からソースをみれば画像のパスはばれてしまうので、

右クリックを禁止にしても簡単にダウンロード出来てしまいます。

さらに、マウスで画像をデスクトップなどへ向けてドラッグ&ドロップされてしまえば、

簡単にダウンロードされてしまいます。

 

とは言え、盗まれにくくはなります。

画像も大事な資源なので、大事な画像は盗まれにくくしておきましょう。

WordPress短期学習プログラム

関連記事

  1. JavaScript

    Javascript

    zoomi.jsでオンマウス時に画像を拡大

    画像にマウスを乗せた時(オンマウス)に拡大画像を表示させたいという依頼…

  2. JavaScript

    Javascript

    Javascriptで画像サイズを取得したい

    &lt;img src="sample.jp" alt="サンプル" …

  3. JavaScript

    Javascript

    jQueryのプラグイン「jCanvas」で間取図を作成

    HTML5のCanvasを使ってやりたい事があったので、本日はjQ…

  4. JavaScript

    Javascript

    写真の右クリックコピーを禁止!!

    弊社は不動産会社様にホームページを提供する機会が多いのですが、その…

  5. JavaScript

    Javascript

    flatpickr【デートピッカー用ライブラリ】

    flatpickrについて先日、という日付け選択用のデート…

  6. JavaScript

    Javascript

    ajaxzip2からajaxzip3へ変えてみました!!

    弊社で日頃からお世話になっているライブラリーといえば、ajaxzi…

最近の記事

  1. Technology-Connection-Net
  2. ドメインにハイフンを使うのは日本人だけ?
  3. SSL(HTTPS)
  4. ドメインについて
  5. WP:WordPress(ワードプレス)
  6. ドメイン(domain)
  7. JPドメイン
  8. 高速(スピード)
  9. ブログアクセス
  10. 高速(スピード)
PAGE TOP