如何从浏览器的右键菜单中禁用“另存为…”以防止客户端下载视频?

是否有更完整的解决方案来阻止客户端直接访问文件路径?


当前回答

+1简单和跨浏览器的方式: 你也可以用css z-index和不透明度把透明的图片放在视频上。 这样用户将在上下文菜单中看到“另存图片为”而不是“保存视频”。

其他回答

简单的回答,

你不能

如果他们正在看你的视频,他们已经有了

你可以让他们慢下来,但不能阻止他们。

以下是我所做的:

function noRightClick() { alert("You cannot save this video for copyright reasons. Sorry about that."); } <body oncontextmenu="noRightClick();"> <video> <source src="http://calumchilds.com/videos/big_buck_bunny.mp4" type="video/mp4"> </video> </body> This also works for images, text and pretty much anything. However, you can still access the "Inspect" and the "View source" tool through keyboard shortcuts. (As the answer at the top says, you can't stop it entirely.) But you can try to put barriers up to stop them.

你可以使用

<video src="..." ... controlsList="nodownload">

https://developer.mozilla.org/en-US/docs/Web/API/HTMLMediaElement/controlsList

它不会阻止保存视频,但它会删除上下文菜单中的下载按钮和“另存为”选项。

首先,要意识到完全阻止视频下载是不可能的,你所能做的只是让下载变得更加困难。也就是说,你隐藏了视频的来源。

网络浏览器会在缓冲区中临时下载视频,所以如果可以阻止下载,你也就阻止了视频被观看。

您还应该知道,世界上只有不到1%的人口能够理解源代码,这使得它相当安全。这并不意味着你不应该把它隐藏在源代码中——你应该这样做。

您不应该禁用右键单击,甚至更不应该显示一条消息说“由于版权原因,您无法保存此视频。对此我很抱歉。”正如这个答案所暗示的。

这对用户来说是非常烦人和困惑的。除此之外;如果他们在浏览器上禁用JavaScript,他们将能够右键单击并保存。

下面是一个你可以使用的CSS技巧:

video {
    pointer-events: none;
}

CSS不能在浏览器中关闭,保护您的视频而不实际禁用右键单击。然而,一个问题是控件也不能启用,换句话说,它们必须设置为false。如果你打算添加自己的播放/暂停功能,或者使用一个有独立于视频标签的按钮的API,那么这是一个可行的选择。

控件也有一个下载按钮,所以使用它也不是一个好主意。

下面是一个JSFiddle的例子。


如果你打算使用JavaScript禁用右键,那么也要将视频源存储在JavaScript中。这样,如果用户禁用JavaScript(允许右击),视频将无法加载(它也更好地隐藏了视频源)。

从TxRegex回答:

<video oncontextmenu="return false;" controls>
    <source type="video/mp4" id="video">
</video>

现在通过JavaScript添加视频:

document.getElementById("video").src = "https://www.w3schools.com/html/mov_bbb.mp4";

功能性JSFiddle


防止右击的另一种方法是使用embed标记。然而,这并没有提供运行视频的控件,所以它们需要在JavaScript中实现:

<embed src="https://www.w3schools.com/html/mov_bbb.mp4"></embed>

The

<body oncontextmenu="return false;"> 

不再有效。截至2018年6月,Chrome和Opera在时间轴上有一个子菜单,允许直接下载,所以用户不需要右键单击来下载视频。有趣的是,Firefox和Edge没有这个功能……