阻止HTML5视频下载(右键保存)?

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

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

当前回答

这是一个完整的解决方案禁用下载，包括右击>另存为…在上下文菜单中:

<video oncontextmenu="return false;" controlsList="nodownload">
</video>

2021-05-26 05:51:36

其他回答

你不能。

这是因为浏览器的设计目的就是:提供内容。但你可以让它更难下载。

方便的“解决方案”

我会把我的视频上传到第三方视频网站，比如YouTube或Vimeo。他们有很好的视频管理工具，优化设备的播放，他们努力防止他们的视频被撕掉，而你却没有付出任何努力。

解决方案1、禁用“右键单击”

你可以禁用上下文菜单事件，也就是“右键单击”。这将防止你的常规skiddie公然撕扯你的视频右击和另存为。但他们可以禁用JS，绕过这个问题，或者通过浏览器的调试器找到视频源。另外，这是糟糕的用户体验。在上下文菜单中有很多合法的东西，而不仅仅是另存为。

解决方案2，视频播放器库

使用自定义视频播放器库。它们中的大多数实现了视频播放器，可以根据您的喜好定制上下文菜单。你不会得到默认的浏览器上下文菜单。如果他们确实提供类似于另存为的菜单项，你可以禁用它。但同样，这是一个JS的解决方案。弱点类似于解决方案1。

解决方案3,HTTP直播

另一种方法是使用HTTP Live Streaming提供视频。它本质上是把视频切成块，然后一个接一个地播放。这就是大多数流媒体网站提供视频的方式。因此，即使你设法另存为，你只保存了一部分，而不是整个视频。收集所有的块并使用一些专用软件将它们缝合起来需要更多的努力。

解决方法4，在画布上作画

另一种技巧是在<canvas>上绘制<video>。在这种技术中，使用一些JavaScript，您在页面上看到的是一个<canvas>元素从隐藏的<video>渲染帧。因为它是一个<canvas>，上下文菜单将使用一个<img>的菜单，而不是一个<video>的。你会得到另存图像，而不是另存视频。

解决方案5,CSRF令牌

您还可以利用CSRF令牌。您可以让服务器在页面上发送一个令牌。然后使用该令牌获取视频。您的服务器在提供视频之前检查它是否是一个有效的令牌，或者获得HTTP 401。这个想法是，你只能通过有一个令牌来获得一个视频，你只能从页面来，而不是直接访问视频url。

2012-03-18 08:05:06

简单的回答,

你不能

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

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

2012-03-18 08:15:02

它似乎通过websocket流视频是一个可行的选择，就像在流帧和绘制他们在画布之类的东西。

使用JavaScript在websockets上传输视频流

我认为这将提供另一个级别的保护，使客户更难获取视频，当然解决了您的问题，“另存视频为…”右键单击上下文菜单选项(过量?!)．

2015-12-11 02:38:31

我们最终使用了url过期的AWS CloudFront。视频将加载，但当用户右键单击并选择另存为最初收到的视频url时，该视频已过期。搜索CloudFront Origin Access Identity。

生成视频url需要一个密钥对，这个密钥对可以在AWS CLI中创建。供参考，这不是我的代码，但它工作得很好!

$resource = 'http://cdn.yourwebsite.com/videos/yourvideourl.mp4';
$timeout = 4;

//This comes from key pair you generated for cloudfront
$keyPairId = "AKAJSDHFKASWERASDF";

$expires = time() + $timeout; //Time out in seconds
$json = '{"Statement":[{"Resource":"'.$resource.'","Condition" {"DateLessThan":{"AWS:EpochTime":'.$expires.'}}}]}';     

//Read Cloudfront Private Key Pair
$fp=fopen("/absolute/path/to/your/cloudfront_privatekey.pem","r"); 
$priv_key=fread($fp,8192); 
fclose($fp); 

//Create the private key
$key = openssl_get_privatekey($priv_key);
if(!$key)
{
    echo "<p>Failed to load private key!</p>";
    return;
}

//Sign the policy with the private key
if(!openssl_sign($json, $signed_policy, $key, OPENSSL_ALGO_SHA1))
{
    echo '<p>Failed to sign policy: '.openssl_error_string().'</p>';
    return;
}

//Create url safe signed policy
$base64_signed_policy = base64_encode($signed_policy);
$signature = str_replace(array('+','=','/'), array('-','_','~'), $base64_signed_policy);

//Construct the URL
$url = $resource.'?Expires='.$expires.'&Signature='.$signature.'&Key-Pair-Id='.$keyPairId;

return '<div class="videowrapper" ><video autoplay controls style="width:100%!important;height:auto!important;"><source src="'.$url.'" type="video/mp4">Your browser does not support the video tag.</video></div>';

2016-09-28 18:32:28

以下是我所做的:

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.

2018-03-09 16:37:04

阻止HTML5视频下载(右键保存)?

推荐文章

最新文章

标签