如何从浏览器的右键单击菜单中禁用“将视频另存为...”以防止客户端下载视频?
是否有更完整的解决方案来防止客户端直接访问文件路径?
如何从浏览器的右键单击菜单中禁用“将视频另存为...”以防止客户端下载视频?
是否有更完整的解决方案来防止客户端直接访问文件路径?
你不能。那是因为这就是浏览器的设计目的:提供内容。但是您可以使其更难下载。
首先,您可以禁用该contextmenu
事件,也就是“右键单击”。这将防止您的普通滑梯通过右键单击并另存为公然翻录您的视频。但随后他们可以禁用 JS 并解决这个问题,或者通过浏览器的调试器找到视频源。另外这是糟糕的用户体验。上下文菜单中有很多合法的东西,而不仅仅是另存为。
您还可以使用自定义视频播放器库。他们中的大多数都实现了视频播放器,可以根据自己的喜好自定义上下文菜单。所以你不会得到默认的浏览器上下文菜单。如果他们确实提供类似于另存为的菜单项,您可以禁用它。但同样,这是一个 JS 解决方法。弱点与前一个选项类似。
另一种方法是使用HTTP Live Streaming提供视频。它本质上的作用是将视频切成块并一个接一个地提供。这是大多数流媒体网站提供视频的方式。因此,即使您设法另存为,您也只能保存一个块,而不是整个视频。使用一些专用软件收集所有块并缝合它们需要更多的努力。
另一种技术是画<video>
上<canvas>
。在这种技术中,使用一点 JavaScript,您在页面上看到的是<canvas>
从隐藏的<video>
. 并且因为它是 a <canvas>
,上下文菜单将使用 an<img>
的菜单,而不是 a 的菜单<video>
。您将获得图像另存为而不是视频另存为。
您还可以使用CSRF 令牌来发挥自己的优势。你会让你的服务器在页面上发送一个令牌。然后您使用该令牌来获取您的视频。您的服务器会在提供视频之前检查它是否是有效令牌,或者获取HTTP 401。这个想法是你只能通过拥有一个令牌来获得视频,只有当你来自页面时才能获得该令牌,而不是直接访问视频网址。
归根结底,我只会将我的视频上传到第三方视频网站,例如 YouTube 或 Vimeo。他们有很好的视频管理工具,优化了设备的播放,他们努力防止他们的视频在你端零努力被翻录。
对于那些希望简单地从 html5 视频中删除右键单击“保存”选项的人来说,这是一个简单的解决方案
$(document).ready(function(){
$('#videoElementID').bind('contextmenu',function() { return false; });
});
www.foo.com/player.html
www.foo.com/videos/video.mp4
在名为“.htaccess”的子目录中保存一个文件并添加以下行。
www.foo.com/videos/.htaccess
#Contents of .htaccess
RewriteEngine on
RewriteCond %{HTTP_REFERER} !^http://foo.com/.*$ [NC]
RewriteCond %{HTTP_REFERER} !^http://www.foo.com/.*$ [NC]
RewriteRule .(mp4|mp3|avi)$ - [F]
现在源链接没用了,但我们仍然需要确保任何尝试下载文件的用户都无法直接获得该文件。
要获得更完整的解决方案,现在使用 Flash 播放器(或 html 画布)提供视频,不要直接链接到视频。要删除右键单击菜单,请添加到您的 HTML:
<body oncontextmenu="return false;">
www.foo.com/player.html将正确播放视频,但如果您访问 www.foo.com/videos/video.mp4:
错误代码 403:禁止
这是对所提出的两个问题的完整回答,而不是对“我可以阻止用户下载他们已经下载的视频吗”这一问题的回答。
简单的回答,
如果他们正在观看您的视频,他们已经拥有
你可以放慢他们的速度,但不能阻止他们。
我通常使用的最好方法很简单,我在整个页面中完全禁用上下文菜单,纯html+javascript:
<body oncontextmenu="return false;">
而已!我这样做是因为您始终可以通过右键单击来查看源。
好吧,你说:“我可以直接使用浏览器查看源代码”,这是真的,但我们从你不能停止下载html5
视频的事实开始。