【发布时间】:2015-12-05 06:25:55
【问题描述】:
我是二进制数据和 getUserMedia 的新手,将 getUserMedia(视频/音频)流式传输到服务器然后为其他连接准备流(视频/音频)的推荐方法是什么?
我最初的想法是通过 websockets 发送数据,然后将数据写入文件 (mp4),如下所示:
getUserMedia -->(websockets)--> server -->(file.mp4)--> video.src.
我一直在查看MediaStreamRecorder,我可以像这样发送缓冲区:
multiStreamRecorder.ondataavailable = function (blobs) {
socket.emit('blobs', blobs)
};
在我得到的服务器上
{ audio: <Buffer 52 49 46 46 2c 10 04 00 57 41 56 45 66 6d 74 20 10 00 00 00 01 00 01 00 44 ac 00 00 10 b1 02 00 02 00 10 00 64 61 74 61 00 10 04 00 f8 ff 04 00 0d 00 ... >,
video: <Buffer 1a 45 df a3 40 20 42 86 81 01 42 f7 81 01 42 f2 81 04 42 f3 81 08 42 82 40 04 77 65 62 6d 42 87 81 02 42 85 81 02 18 53 80 67 10 0a 41 54 15 49 a9 66 ... >,
onDataAvailableEventFired: true }
现在我认为我应该将其写入文件,提供该文件,然后从video 元素的源请求该文件。如果这一切都正确,我将如何将文件写入文件系统?还是我做错了什么?
我了解 WebRTC 具有 p2p 功能,我将向大约 50 个或更多客户端提供视频流,所以它不是一个选项。
更新 websocket 解决方案:
我现在通过 websocket 将数据发回,如下所示:
socket.on('blobs', function(data){
socket.emit('blobs', data)
})
并在客户端将其推入 mediaSource 和 video 元素和 timestampOffset 以保持流畅。
var mediaSource = new MediaSource(),
mediaBuffer,
// init duration of 0 seems fine
duration = 0;
var video = $('video').get(0);
video.src = window.URL.createObjectURL(mediaSource);
mediaSource.addEventListener('sourceopen', function(e) {
mediaBuffer = mediaSource.addSourceBuffer('video/webm; codecs="vp8"')
mediaBuffer.addEventListener('update', function() {
// wait for mediaBuffer update to fire before setting the new duration
duration = video.duration
});
}, false);
socket.on('blobs', function (data) {
mediaBuffer.timestampOffset = duration;
mediaBuffer.appendBuffer(new Uint8Array(data.video));
});
【问题讨论】:
-
我在寻找使用 MediaRecorder API 而不是 MediaStreamRecorder 库的解决方案时发现了这个问题。有一个nice answer in another question
-
那么 server.js 脚本是如何处理监听端口的,我需要服务器端脚本吗?
-
@ASahra 已经为服务器端提供了解决方案。 OP 只是使用
socket.on('blobs', function(data){socket.emit('blobs', data)})将流发送给其他用户,实际上只是将其用作 1:1 传输。
标签: node.js websocket video-streaming webrtc getusermedia