来自android webview的peerjs webrtc流式视频速度太慢
我有一个android应用程序,它通过peerjs(webrtc)通过webview发送摄像头流。浏览器上的web应用程序接收视频并流式传输 一切正常,但网络上的视频速度太慢,图像在获得第二张图像之前会冻结一段时间 有没有办法降低分辨率?或者在web应用程序上缓冲视频?或者可能是我的实现出了问题 Android网络视图代码:来自android webview的peerjs webrtc流式视频速度太慢,android,video,android-webview,webrtc,peerjs,Android,Video,Android Webview,Webrtc,Peerjs,我有一个android应用程序,它通过peerjs(webrtc)通过webview发送摄像头流。浏览器上的web应用程序接收视频并流式传输 一切正常,但网络上的视频速度太慢,图像在获得第二张图像之前会冻结一段时间 有没有办法降低分辨率?或者在web应用程序上缓冲视频?或者可能是我的实现出了问题 Android网络视图代码: initVideo = function(videoSourceValue) { var video = document.querySe
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));
}
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}
,但仍然存在相同的问题
我还在向服务器发送位置数据,视频流和位置数据似乎是定期一起发送的(web上显示速度和视频同时移动的图表),但帧速率太慢。建立视频/音频流时,您可以指定一些限制条件
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是视频驱动程序作者认为质量和带宽之间可接受的折衷。限制图片的尺寸也有帮助
查看此链接了解模式详细信息:我的问题与带宽完全无关,我只是没有在视频标签上添加autoplay,因此视频只有在重画时才会刷新
非常感谢您的回答,他们真的提供了有关webrtc中工作原理的见解。当我从浏览器设置它时,我不会设置从浏览器到设备的流的值吗?这是真的,有些控制比没有控制好。台式机往往认为它们有很好的可用带宽,因此限制发送的内容会有所不同。我认为移动设备的默认值无论如何都更低。在我的实验中,它确实会产生difference@Mikkel你知道引用“质量”属性的文档在哪里吗?我不知道是否有任何关于质量的内容,我使用了一个介于1和9之间的数字。玩它,看看吧,老实说,我只是建议你离开webview,改用native(这样你就有更多的控制权了)。我知道这并不是一个真正的答案:(.你也可以尝试在webview代码中设置视频流参数,不确定这是否需要。我对使用原生android方式持开放态度,我只是发现它要复杂得多(在web上,我只是使用peerjs),如果你有一个链接或库,可以直接通过android进行简单的视频流传输,那就太完美了。你想打双向电话还是单向电话就足够了?在网络上(我假设是chrome),你能去吗chrome://webrtc-internals 并粘贴传入和传出视频流的统计信息?让通话持续几分钟。