Question

举个例子，假设我的网站上设置了video个对象，其中包含以下属性：

<video controls="" preload="auto" id="_video"></video>

，原始来源为./video/video.mp4（例如）。

如何通过将原始源文件转换为 BLOB网址来保护原始源文件的位置？

我看过一些帖子说它需要通过JavaScript完成，但实际上没有一个帖子能解释如何操作，或者你可以找到它。

那么，你会怎么做;这样做的最佳方式是什么？

我不是 JavaScript 中最棒的，所以如果它看起来像是一个明显的问题，请道歉。

感谢。： - ）

Answer 1

使用new XMLHttpRequest()将responseType设置为blob来请求视频。

使用xhr.result将new FileReader()传递给readAsDataURL，这将为您提供该文件的base-64编码字符串表示。

将此字符串传递给atob，将base-64编码的字符串解码为表示二进制数据的每个字节的字符串。现在，您可以使用array循环字节字符串来创建charCodeAt个字节值。

可以将array传递给new Uint8Array()以创建一个8位无符号整数的类型化数组，然后将其传递给new Blob()构造函数。

现在您有blob，您可以使用URL.createObjectURL()并将创建的blob传递给它。创建的对象网址可以传递到src DOM元素的video属性。

这是一个快速而肮脏的例子。希望能帮助到你。请务必查看所有使用方法的文档并检查其浏览器支持。这不会保护您的视频无法下载。

＆＃13;

var xhr = new XMLHttpRequest();
xhr.responseType = 'blob';

xhr.onload = function() {
  
  var reader = new FileReader();
  
  reader.onloadend = function() {
  
    var byteCharacters = atob(reader.result.slice(reader.result.indexOf(',') + 1));
    
    var byteNumbers = new Array(byteCharacters.length);

    for (var i = 0; i < byteCharacters.length; i++) {
      
      byteNumbers[i] = byteCharacters.charCodeAt(i);
      
    }

    var byteArray = new Uint8Array(byteNumbers);
    var blob = new Blob([byteArray], {type: 'video/ogg'});
    var url = URL.createObjectURL(blob);
    
    document.getElementById('_video').src = url;
    
  }
  
  reader.readAsDataURL(xhr.response);
  
};

xhr.open('GET', 'https://upload.wikimedia.org/wikipedia/commons/c/c0/Roaring_Burps.ogg');
xhr.send();

＆＃13;

<video controls="" preload="auto" id="_video"></video>

＆＃13;

Answer 2

要创建Blob URL，我找到了this answer。这样加载大文件的速度比DavidDomain的答案快得多（对于我的> 100MB视频文件来说，这花了太长时间，这是无法接受的）。虽然，我相信这会将整个视频下载到浏览器的内存中，并将数据嵌入到DOM中，所以较大的文件可能仍然会引起其他性能问题。

为什么要“ [保护]原始视频文件的位置”？如果有人找到了视频的位置并请求了视频文件，则应提供该文件：这是服务器的工作。

AFAIK实际上，在不公开获取该视频文件所需的URL的情况下，加载视频文件几乎是不可能的。（将其嵌入DOM服务器端在技术上应该是可行的，但这将迫使整个视频在页面显示任何内容之前就被加载，并且将无法使用）

Answer 3

将其分成100件。在您的JavaScript中混淆重组（可能使用秘密命令），并确保其最小化。

还要查看CORS设置。

将视频对象源文件设置为blob网址

3 个答案: