防止下载 HTML5 视频（右键保存）？

Question

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

是否有更完整的解决方案可以防止客户端直接访问文件路径？

原文由 python 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

---

你不能。

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

---

便捷的“解决方案”

我只是将我的视频上传到第三方视频网站，如 YouTube 或 Vimeo。他们有很好的视频管理工具，优化了设备的播放，并且他们努力防止他们的视频被你零努力地翻录。

---

解决方法 1，禁用“右键单击”

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

---

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

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

---

解决方法 3，HTTP 实时流式传输

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

---

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

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

---

解决方法 5，CSRF 令牌

你也可以使用 CSRF 代币 来发挥你的优势。你会让你的服务器在页面上发送一个令牌。然后，您使用该令牌来获取您的视频。您的服务器会在提供视频之前检查它是否是有效令牌，或者获取 HTTP 401 。这个想法是，您只能通过拥有一个令牌来获取视频，如果您来自页面，而不是直接访问视频网址，您只能获得该令牌。

---

原文由 Joseph 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 2

对于那些希望简单地从 html5 视频中删除右键单击“保存”选项的人来说，这是一个简单的解决方案

$(document).ready(function(){
   $('#videoElementID').bind('contextmenu',function() { return false; });
});

原文由 Clayton Graul 发布，翻译遵循 CC BY-SA 3.0 许可协议