如何从浏览器的右键菜单中禁用“另存为…”以防止客户端下载视频?
是否有更完整的解决方案来阻止客户端直接访问文件路径?
如何从浏览器的右键菜单中禁用“另存为…”以防止客户端下载视频?
是否有更完整的解决方案来阻止客户端直接访问文件路径?
当前回答
如果你正在寻找一个完整的解决方案/插件,我发现这个非常有用 https://github.com/mediaelement/mediaelement
其他回答
我们可以通过隐藏上下文菜单来让这变得不那么容易,就像这样:
<video oncontextmenu="return false;" controls>
<source src="https://yoursite.com/yourvideo.mp4" >
</video>
是的,你可以通过三个步骤做到这一点:
将要保护的文件放置在运行代码的目录的子目录中。 www.foo.com/player.html www.foo.com/videos/video.mp4 在该子目录中保存一个名为“”的文件。并添加下面的行。 www.foo.com/videos/.htaccess # .htaccess的内容 RewriteEngine上 RewriteCond % {HTTP_REFERER} ! ^ http://foo.com/。* $(数控) ^http://www.foo.com/.*$ [NC] 重写规则(mp4|mp3|avi)$ - [F]
现在源链接是无用的,但我们仍然需要确保任何试图下载该文件的用户不能直接获得该文件。
对于一个更完整的解决方案,现在为视频提供一个flash播放器(或html画布),不要直接链接到视频。只需删除右键菜单,添加到您的HTML: <body oncontextmenu="return false;">
结果:
www.foo.com/player.html可以正确播放视频,但如果你访问www.foo.com/videos/video.mp4:
错误代码403:禁止
这将工作直接下载,cURL,盗链,你的名字。
这是对两个问题的完整回答,而不是对“我能否阻止用户下载他们已经下载的视频”这个问题的回答。
The
<body oncontextmenu="return false;">
不再有效。截至2018年6月,Chrome和Opera在时间轴上有一个子菜单,允许直接下载,所以用户不需要右键单击来下载视频。有趣的是,Firefox和Edge没有这个功能……
作为客户端开发人员,我推荐使用blob URL, blob URL是一个引用二进制对象的客户端URL
<video id="id" width="320" height="240" type='video/mp4' controls > </video>
在HTML中,让你的视频src为空, 在JS中使用AJAX获取视频文件,确保响应类型是blob
window.onload = function() {
var xhr = new XMLHttpRequest();
xhr.open('GET', 'mov_bbb.mp4', true);
xhr.responseType = 'blob'; //important
xhr.onload = function(e) {
if (this.status == 200) {
console.log("loaded");
var blob = this.response;
var video = document.getElementById('id');
video.oncanplaythrough = function() {
console.log("Can play through video without stopping");
URL.revokeObjectURL(this.src);
};
video.src = URL.createObjectURL(blob);
video.load();
}
};
xhr.send();
}
注意:大文件不建议使用此方法
EDIT
使用跨源阻塞和头标记检查来防止直接下载。 如果视频是通过API传递的;使用不同的http方法(PUT / POST)来代替'GET'
你不能。
例如,人们可以使用一些api例如desktopCapture, getUserMedia 允许用户记录屏幕、窗口、选项卡。
人们可以使用它并将其写入画布,然后将所有的块连接在一起以获得视频,
所以如果他们真的想要视频,没有办法阻止他们下载。