嘗試使用getUserMedia幀率約束

Question

我試圖調整getUserMedia攝像頭流的幀率顯示。我試圖使用的方法是在Moz開發人員網絡中引用的

var constraints = { video: { frameRate: { ideal: 10, max: 15 } } }; 

。

我想創建幾個函數可以調用幀率更改爲不同的設置，但在試圖實現約束它似乎並沒有產生效果。我已經嘗試使用它單獨

function setFps1() { 
var constraints ... 
} 

而且內功能，這（重新）宣佈流

function useVideo(){ 
    // Query user for device permission 
    navigator.mediaDevices.getUserMedia({video: true}) 
    // If granted 
    .then(function(stream) { 
     // Stream & play video from webcam 
      var video = document.getElementById('userVideo'); 
      var constraints = { video: { frameRate: { ideal: 10, max: 15 } } }; 
      video.src = window.URL.createObjectURL(stream); 
      video.play(); 
     }) 
    // If not 
    .catch(function(error) { 
     alert(error.message); 
    }); 
    } 

，並試圖

function useVideo(){ 
    // Query user for device permission 
    navigator.mediaDevices.getUserMedia({video: true}) 
    // If granted 
    .then(function(stream) { 
     // Stream & play video from webcam 
      var video = document.getElementById('userVideo'); 
      video.src = window.URL.createObjectURL(stream); 
      video.play(); 
      var constraints = { video: { frameRate: { ideal: 10, max: 15 } } }; 
     }) 
    // If not 
    .catch(function(error) { 
     alert(error.message); 
    }); 
    } 

的好辦法，想也許該視頻有在可以設置幀速率之前先播放。

如何意味着幀率限制使用，或者是什麼阻止我使用它嗎？

Answer 1

線：

var constraints = { video: { frameRate: { ideal: 10, max: 15 } } }; 

只是initializates一個局部變量constraints到指定的對象。對別的沒有影響。

您可以設置相機的約束與功能getUserMedia或applyConstraints，例如：

navigator.mediaDevices.getUserMedia(constraints) 
    .then(function(stream) { 
    var video = document.getElementById('userVideo'); 
    video.srcObject = stream; 
    video.play(); 
    }) 
    .catch(error => console.log(error)); 

或

var track = video.srcObject.getVideoTracks()[0]; 

track.applyConstraints(constraints).catch(e => console.log(e)); 

一旦你得到的工作，請注意瀏覽器目前實行的限制a bit differently。