動画やスライド画像のダウンロードを禁止する方法

通常Webページから画像を保存するには、画像の上にカーソルをあわせて右クリックし、「名前を付けて画像を保存」を選択すれば可能になりますが、meclibのポップアップで配置した動画やスライド画像も同様で、右クリックから保存が可能です。

 

meclibをご利用のお客様から、この右クリックでの保存をさせたくないというご意見をお聞きします。
インターネット上に公開している以上、完全に保存させないようにすることは難しいですが、右クリックでの保存操作を簡単に禁止させる事は可能です。
今回はその方法をご紹介します。

動画のダウンロードを禁止する方法

HTMLファイルの編集が必要になるため、コンテンツジェネレータで作成した動画コンテンツを利用します。
「コンテンツジェネレータ」はmeclibマイページの左メニュー、またはブック編集画面からアクセスできます。

 

 

1.動画コンテンツ(zipファイル)を解凍し、その中に含まれる「index.html」をテキストエディタなどで開きます。

 

2.「index.html」で次のように、画像上で右クリックを禁止する設定を追加し、変更し保存します。

 

bodyタグの設定を変更します。

<body>

<body oncontextmenu="return false;">

 

videoタグの設定を変更します。

<video controls preload="auto" width="100%" height="100%">

<video controls controlsList="nodownload" preload="auto" width="100%" height="100%">

 

3.再度フォルダごと、zip圧縮します。

 

以上の操作で完了です。
ブック編集のリンク設定やコンテンツ設定でアップロードの上、紙面上に配置してください。

 

それでは、設定前と設定後でどのように変わったかを、見ていきましょう。

 

ダウンロード禁止の設定をする前の動画のコントロールバー

動画のコントロールバー(︙)をクリックすると出現するメニューに「ダウンロード」の文字が表示しています。

 

 

ダウンロード禁止の設定をした後の動画のコントロールバー

動画のコントロールバー(︙)をクリックすると出現するメニューに「ダウンロード」が表示しなくなりました。

 

 

右クリック禁止を設定する前の動画

右クリックによるメニューが表示します。

 

右クリック禁止を設定した後の動画

右クリックによるメニュー表示が無効になりました。

 

 

スライド画像上で右クリック禁止にする方法

前項でご説明した動画コンテンツと同様、HTMLファイルの編集が必要になるため、コンテンツジェネレータで作成したスライド(複数画像)コンテンツを利用します。
「コンテンツジェネレータ」はmeclibマイページの左メニュー、またはブック編集画面からアクセスできます。

 

 

1.スライドコンテンツ(zipファイル)を解凍し、その中に含まれる「index.html」をテキストエディタなどで開きます。

 

2.「index.html」で次のように、画像上で右クリックを禁止する設定を追加し、変更し保存します。

 

# bodyタグの設定を変更します。

<body>

<body oncontextmenu="return false;">

 

# headの閉じタグ </head> の1行前に次のスタイルを追加し保存します。

<style type="text/css">
img { pointer-events: none; }
</style>

 

3.再度フォルダごと、zip圧縮します。

 

以上の操作で完了です。
先程の動画コンテンツと同じようにリンク設定やコンテンツ設定でアップロードの上、紙面上に配置してください。

 

それではこちらも、設定前と設定後でどのように変わったかを、見ていきましょう。

右クリック無効を設定する前のスライド画像

スライド上で右クリックするとメニューが表示します。

 

右クリック禁止を設定したスライド画像

スライド上で右クリックによるメニュー表示が無効になりました。

 

最後に

今回は、右クリックで動画や画像のダウンロードをさせない方法をご紹介しました。
最初にも触れましたが、完全に画像の保存を禁止することはできませんが、誰でも簡単にダウンロードできるということはなくなると思います。

ぜひ、お試しください。