Erhalten Medien Details (Auflösung und Frame-Rate) von Mediastream Objekt

Question

ich die Kamera des Benutzers bin Erfassung, ich will möglich, das Bild mit der besten Auflösung fangen so mein Code so etwas wie das Snippet unten ist,

Ich mag um die Auflösung Details aus dem eingehenden Stream zu lesen, so kann ich es als Höhe und Breite des Videos, die ich verwenden, um Snapshot klicken, möchte ich den Snapshot von der besten Qualität durch den Stream angeboten werden, ist dies möglich (Auflösung zu lesen Details von stream Variable)?

EDIT: Ich Übertragung des Videos mit webrtc so würde ich auch

$(document).ready(function(){ 

navigator.getUserMedia = (navigator.getUserMedia ||navigator.mozGetUserMedia ||navigator.webkitGetUserMedia ||navigator.msGetUserMedia); 


if(navigator.getUserMedia){ 
    navigator.getUserMedia({ video: true, audio:true}, function(stream) { 
    var video = $('#video')[0]; 
    video.src = window.URL.createObjectURL(stream); 
    video.muted=true; 
    //$('#video').hide(); 
    }, function(){ 
    showMessage('unable to get camera', 'error'); 
    }); 
}else{ 
    showMessage('no camera access mate.', 'error'); 
} 



function showMessage(msg,type) { // type 'success' or 'error' 
    $('#msg').text(msg); 
} 

}) 

der HTML-Code, um die Framerate des übertragenen Videodaten, um herauszufinden, wie:

<div id='msg' class'message'></div> 
    <div > 
    <video id='video' autoplay></video> 
    </div> 

Answer 1

können Sie Erhalten Sie eine Video-Stream-native Auflösung aus dem Video-Element, sobald der Stream über geladene Metadaten mit dem Stream verbunden ist. Dies liefert keine Bildfrequenzinformation.

navigator.getUserMedia({ video: true, audio:true}, function(stream) { 
    var video = $('#video')[0]; 
    video.src = window.URL.createObjectURL(stream); 
    video.muted=true; 
    video.onloadedmetadata = function() { 
     console.log('width is', this.videoWidth); 
     console.log('height is', this.videoHeight); 
    } 
    //$('#video').hide(); 
    }, function(){ 
    showMessage('unable to get camera', 'error'); 
    }); 

Per den W3C draft, die Medienspur innerhalb des Stroms sollte diese Informationen zur Verfügung stellen, aber in der Praxis Browser hat es noch zu implementieren.

Die getCapabilities() Methode gibt das Wörterbuch des Namen von den constrainable Eigenschaften, die das Objekt unterstützt.

Answer 2

navigator.mediaDevices.getUserMedia() Methode gibt MediaStream Objekt mit Ihnen Video- und Audio-Streams. Dieses MediaStream Objekt hat getVideoTracks() und getAudioTracks() Methoden.

getVideoTracks()[0] gibt den Videostream von der lokalen Webcam zurück. Dieses Videospur-Objekt hat GetSettings() -Methode Rückkehr einige nützliche Eigenschaften wie:

stream.getVideoTracks()[0].getSettings().deviceId 
stream.getVideoTracks()[0].getSettings().frameRate 
stream.getVideoTracks()[0].getSettings().height 
stream.getVideoTracks()[0].getSettings().width 
stream.getVideoTracks()[0].getSettings().frameRate 

Ergebnis, zum Beispiel:

aspectRatio: 1,3333333333333333

deviceId: "e85a2bd38cb0896cc6223b47c5d3266169524e43b6ab6043d8dd22d60ec01a2f"

frameRate: 30

height: 480

width: 640

---

aspectRatio - 4x3 (1.3333333333333333) oder 16x9 (Vollbild oder nicht),

deviceId - Webcam Id,

framRate - Framerate der Videodaten,

width - Video Breite,

height - Video Höhe.