如何在WebRTC通话期间锁定视频大小？

Question

I am working on this video broadcasting example.

I have experienced something I dont know how to fix. During the video call / broadcast the video size seems to be changed by Chrome over time quite often. How can I make the video size / resolution constant?

I dont know if this has an effect, but I commented out the video css styling in the css file (/public/main.css). I commented out this:

video { width: 100%; height: 100%; position: absolute; display: block; top: 0; left: 0; object-fit: cover;}

Can I lock the size with CSS? Or is this a WebRTC thing that I have no influence?

I know that WebRTC can reduce the resolution if for example there is not enough bandwith. But how then to tell WebRTC not to resize video anyway? Is this just a CSS trick after all (haven't tried it yet)?

Answer 1

You can set the size at which the video element is displayed using CSS. Note that you can (for good reasons, typically bandwidth or CPU limitations) not stop WebRTC implementations from reducing the resolution actually sent.

Check either the video elements videoWidth and videoHeight attributes or use the RTCPeerConnection.getStats() API to get the actual resolution.