当移动设备旋转时，在 get User Media Api JavaScript 中交换宽度和高度

Question

我正在使用相机 git getUserMedia()，但我有一个大问题，因为我只是将视频和高度设置为 1280 和 720：

  videoConstraints.width = { min: 1280, ideal: 1280, max: 1280};
  videoConstraints.height = { min: 720, ideal: 720, max: 720};

它在电脑上完美运行，在手机上也完美运行，但是宽度和高度在移动设备上交换，我必须在横向模式下使用移动设备，在纵向模式下高度为 1280，宽度为 720，而在横向模式下为高度720和宽度1280（如我想要的），所以我一直在寻找这方面的信息，但我真的没有找到真正的解决方案。

获取用户媒体 API 参考： https://developer.mozilla.org/es/docs/Web/API/MediaDevices/getUserMedia

视频限制参考：https://developer.mozilla.org/en-US/docs/Web/API/MediaStreamConstraints/video

Answer 1

所以，面对这个问题我没有发现问题，我所做的是使用样式移动媒体查询制作自定义样式。

Answer 2

不要通过图像标签中的 HTML 属性分配绝对宽度值，而是分配将图像定位为百分比相对宽度值的 CSS 规则 max-width，如下所示： img {max-width:100%}尝试看看会发生什么。