0

我想在浏览器中录制视频，然后为用户播放。我目前正在使用 MediaRecorder API（目前仅在 Firefox 中可用）来执行此操作。它适用于短于几秒钟的视频，但否则视频根本不会显示。

控制台或类似内容中没有错误，我在文档中找不到任何有关文件大小限制的信息。

这是我正在使用的代码（仅限 Firefox）：

索引.html：

<!DOCTYPE html>
<html>
<body>
  <button id="start">Start</button>
  <button id="stop">Stop</button>
  <video id="player" src="" width="300" height="300" autoplay></video>

  <script src="script.js"></script>
</body>
</html>

脚本.js：

var record = document.getElementById('start');
var stop = document.getElementById('stop');
var video = document.getElementById('player');

var constraints = {video: true};

var onSuccess = function(stream) {
  var mediaRecorder = new MediaRecorder(stream);

  record.onclick = function() {
    mediaRecorder.start();
  }

  stop.onclick = function() {
    mediaRecorder.stop();
  }

  mediaRecorder.ondataavailable = function(e) {    
    video.src = window.URL.createObjectURL(e.data);
  }
};

var onError = function(err) {
  console.log('The following error occured: ' + err);
}

navigator.mozGetUserMedia(constraints, onSuccess, onError);

在 Codepen 上：http ://codepen.io/anon/pen/xGqKgE

这是一个错误/浏览器问题吗？这个 API 有什么我不知道的限制吗？

4

0 回答 0