Javascript 将视频从客户端发送到服务器

我最近读到一篇关于文件API的文章，它允许客户端使用网站中文件系统中的文件

我做了所有的事情，包括添加文件输入标签，读取文件和所有内容

我使用

FileReader

将文件读取为

ArrayBuffer

，并在其上使用

Uint8Array

视图，然后将视图发送到服务器

我尝试了txt、pdf和图像，效果很好。但是当我把它和视频文件一起使用时，电脑就落后了，我甚至没有等，就关闭了浏览器

这是

---

为什么视频文件会出现延迟？有什么方法可以避免吗

我看了一遍代码，您将读取的数据追加到数组中，这可能是它延迟的原因

你需要分块上传视频。要制作您选择的文件块，您可以在这里查看

您需要根据您的要求进行修改。在这里，当你得到区块时，请求上传或播放它

你也可以在这里播放你的视频文件

---

希望这能解决你的问题。要使其正常工作，您还需要在后端正确处理块。

向我们展示“滞后”的代码。文本和pdf文件的大小要小得多，因此可以快速处理。好的，但它是异步的，但无论如何，我如何避免滞后？看看答案

  function readBlob(opt_startByte, opt_stopByte) {
    var files = document.getElementById('files').files;
    if (!files.length) {
      alert('Please select a file!');
      return;
    }

    var file = files[0];
    var start = parseInt(opt_startByte) || 0;
    var stop = parseInt(opt_stopByte) || file.size - 1;

    var reader = new FileReader();

    // If we use onloadend, we need to check the readyState.
    reader.onloadend = function(evt) {
      if (evt.target.readyState == FileReader.DONE) { // DONE == 2
        document.getElementById('byte_content').textContent = evt.target.result;
        document.getElementById('byte_range').textContent = 
            ['Read bytes: ', start + 1, ' - ', stop + 1,
             ' of ', file.size, ' byte file'].join('');
      }
    };

    var blob = file.slice(start, stop + 1);
    reader.readAsBinaryString(blob);
    }

    document.querySelector('.readBytesButtons')
      .addEventListener('click', function(evt) {
    if (evt.target.tagName.toLowerCase() == 'button') {
      var startByte = evt.target.getAttribute('data-startbyte');
      var endByte = evt.target.getAttribute('data-endbyte');
      readBlob(startByte, endByte);
    }
  }, false);