4

我有一个android应用程序，它通过peerjs（webrtc）通过webview发送相机流，浏览器上的web应用程序接收视频并流式传输。

一切正常，但网络上的视频太慢了，图像在获得第二张图像之前冻结了一段时间......

有没有办法降低分辨率？或缓冲网络应用程序上的视频？还是我的实施有问题？

安卓网页视图代码：

        initVideo = function(videoSourceValue) {

        var video = document.querySelector('video');
        navigator.getUserMedia({video:  {optional: [{
                                                    sourceId: videoSourceValue
                                                     }]
                                          }
                                },function(stream) {
        video.src = window.URL.createObjectURL(stream);
        $('#peerId').text("calling : " + SERVER_PEER_ID);
         var mediaConnection = peer.call(SERVER_PEER_ID, stream);
          mediaConnection.on('stream', function(remoteStream) {
            // Show stream in some video/canvas element.
          });
        },function(e){
                console.log('failed',e);
        });
    }

网页部分：

   function getVideoStream() {
    PEER.on('call', function(call) {
        var mediaConnection = navigator.getUserMedia({video: true}, function(stream) {
            call.answer(stream); // Answer the call with an A/V stream.
            call.on('stream', onReceiveStream);
        }, function(err) {
            console.log('Failed to get local stream' ,err);
        });
    });
}


    function onReceiveStream(stream){
        console.log('received stream');
        $('video').prop('src',window.URL.createObjectURL(stream));

}

谢谢

更新 1

我试图添加{reliable : true}，仍然有同样的问题。

我也在向服务器发送位置数据，并且似乎视频流和位置数据是定期一起发送的（网上的图表显示速度和视频同时移动）但帧速率太慢。

4

2 回答 2

3

我的问题与带宽完全无关，我只是没有在视频标签上设置自动播放，所以视频只有在重绘发生时才会刷新。

非常感谢您的回答，他们确实深入了解了 webrtc 中的工作原理。

于 2017-01-28T09:45:31.573 回答
3

当您建立视频/音频流时，您可以指定一些约束...

var videoOptions = (isCordova) ? {audio: true, video: true} :
                    {  audio: true, 
                      video: {
                        mandatory: {
                               maxWidth: 640,
                               maxHeight: 360,
                               // maxAspectRatio:4/3,
                               // maxFrameRate:1
                              },
                        quality: 7,
                        width: { ideal: 320 },
                        height: { ideal: 240 }
                      }
                    };

navigator.getUserMedia(videoOptions, function (stream) {

在上面的代码中，如果您在设备（android/ios）上，您无法选择，但您可以在浏览器上控制它。质量 5 是视频驱动程序作者认为是质量和带宽之间可接受的折衷的水平。限制图片的尺寸也有帮助。

有关模式详细信息，请参阅此链接：https ://developer.mozilla.org/en-US/docs/Web/API/MediaDevices/getUserMedia

于 2017-01-25T01:42:18.870 回答