Question

我知道我可以在初始化状态下定义视频流分辨率：

var video_constraints = {
  mandatory: {
    maxHeight: 480,
    maxWidth: 640 
  },
  optional: []
};

navigator.getUserMedia({
  audio: false,
  video: video_constraints
}, onsuccess);

我想知道有什么方法可以在通讯过程中改变视频流分辨率，即在初始化之后？

Answer 1

规范中有MediaStreamTrack.applyConstraints()，但到目前为止，它在浏览器中是否支持或者可能已被删除？对我来说，目前看来这是不可能的。另请查看this question at SO。

唯一可以根据上面的问题更改流。一种可能性是创建具有更高分辨率的新流，添加该流并替换其他流上的流。之后，您可以停止/分离流。

Answer 2

如果要根据互联网连接强度更改流式视频的大小，只需将CSS标签中的video标签/ canvas标签的高度和宽度设置为auto。它将自动更改。

<video id="" style="width: auto, height: auto"></video>

Answer 3

我也有同样的情况。所以我用了这种技术。

（01）用新的视频约束替换本地流。

（02）用新的流轨道替换了发送方轨道。

function gotLocalStream(mediaStream) {
    localVideo.srcObject = mediaStream;

    const track = mediaStream.getVideoTracks()[0];
    const constraints = track.getConstraints();

    changePeerTrack()
};


async function startMyLocalStream(constraints){

   return new Promise((resolve,reject)=>{
     try{
         if (localStream) {
            localStream.getTracks().forEach(track => {
                track.stop();
            });
         }

         navigator.mediaDevices.getUserMedia(constraints)
            .then(gotLocalStream)
            .then(()=>{
                resolve(true)
            })
            .catch(e => {
                mediaError('getUserMedia', e.message, e.name);
            });
       }
       catch (e){
          //todo over constraints error
          console.error(e);
          reject(e);
       }
    })
}

function changePeerTrack(){
   if(localPeerConnection){
      localStream.getTracks().forEach( (track)=>{
         var sender = localPeerConnection.getSenders().find(function(s) {
             return s.track.kind == track.kind;
         });
         sender.replaceTrack(track);
      });
   }
 }

/**
 * change the video quality
**/
let constraints = {
    video: {width: {exact: 1280}, height: {exact: 720}, facingMode: "user"}
}
startMyLocalStream(constraints)

对我有用。 You can check your browser compatibilities here

WebRTC - 在通信过程中改变视频分辨率

3 个答案: