JS中WebRTC设置BitRate无效？如何降低iPhone Safari录屏文件大小？

我使用以下代码尝试通过WebRTC设置视频参数：

var constraints = {
       video: {
          width: {exact: 320},
          height: {exact: 240},
          bitRate: {
            max: 400,
            min: 400,
          },
          frameRate: {
            min: 15,
            max: 15
          }
        },
      }

window.navigator.mediaDevices.getUserMedia(constraints);

测试后发现width、height、frameRate参数均能正常生效，但bitRate参数无法生效。想请教：

1. 在JS中使用WebRTC能否设置BitRate？
2. 有没有其他方法可以减小录制视频的文件大小？目前iPhone Safari录制的视频文件过大，导致上传等待时间过长。

WebRTC设置BitRate的说明 #

getUserMedia的约束参数里并不支持bitRate，这就是你设置后无效果的核心原因。WebRTC的码率控制需要在媒体流的编码配置阶段操作，而非获取流的环节。

减小视频文件大小的实用方案 #

针对iPhone Safari的场景，推荐以下几种方法：

• 通过MediaRecorder指定编码码率：如果使用MediaRecorder录制视频，初始化时可以直接配置编码格式和码率参数，示例代码如下：

  const mediaRecorder = new MediaRecorder(stream, {
    mimeType: 'video/mp4; codecs="avc1.42E01E"', // 指定H.264编码
    videoBitsPerSecond: 400000 // 设置为400kbps
  });
  

  注意：iPhone Safari从iOS 14.3版本开始才支持H.264编码的MediaRecorder，需要确认用户设备系统版本。
• 进一步降低分辨率和帧率：你当前已经做了基础调整，若场景允许，可尝试更低的参数（比如240x180分辨率、10fps帧率），能显著压缩文件体积。
• 选择合适的编码格式：目前H.264是Safari支持最完善的高效编码格式；AV1虽有更高压缩率，但Safari对其支持有限，暂不推荐在该场景使用。
• 后端二次压缩：如果前端压缩效果达不到预期，可在视频上传至后端后，用FFmpeg等工具进行二次压缩，调整码率、分辨率或转换格式。

内容的提问来源于stack exchange，提问作者SantinoDu