咱们先拆解下核心问题：Safari（包括macOS和iOS端）对WebM格式的原生支持一直有限，而且旧版本Safari甚至未完全实现MediaRecorder API，这就是你看到控制台提示“browser does not support media recorder api”的根本原因。下面分方案帮你解决：

一、调整RecordRTC配置适配Safari #

1. 切换到通用兼容的视频格式 #

WebM在Safari中兼容性极差，建议直接改用所有现代浏览器都支持的MP4（H.264编码）格式，同时强制使用控制台提示的WhammyRecorder（无需依赖原生MediaRecorder API）：

const options = {
  type: 'video',
  mimeType: 'video/mp4', // 替换为Safari原生支持的MP4格式
  bitsPerSecond: 128000,
  timeSlice: 1000,
  recorderType: RecordRTC.WhammyRecorder // 强制启用Canvas-based录制方案
};

WhammyRecorder是RecordRTC内置的无API依赖录制方案，刚好能绕过Safari对MediaRecorder的支持缺陷。

2. 同步调整上传与服务器配置 #

上传时记得把文件名后缀改为.mp4，同时确保服务器返回视频文件时，响应头的Content-Type设置为video/mp4——这一步很容易被忽略，却是Safari识别视频的关键：

var recordedBlob: Blob = recordRTC.getBlob();
formData.append('files', recordedBlob, `${this.courseComponent?.courseComponent?.name}.mp4`);

二、关于Twilio的适用性 #

你关心的Twilio完全支持单用户独立录制场景，不需要建立实时通话。具体实现逻辑很清晰：

• 通过Twilio Video SDK创建本地视频轨道（LocalVideoTrack）
• 调用轨道的record()方法启动录制
• 录制结束后直接获取Blob文件，上传到你的服务器或存储到Twilio云服务

Twilio的优势是已经封装好了全浏览器兼容逻辑，不需要自己处理格式和API差异；缺点是需要接入第三方服务，有一定学习成本和服务费用。

三、其他跨浏览器替代方案 #

如果不想依赖第三方服务，还可以考虑这些轻量方案：

• 原生MediaRecorder + Polyfill：使用mediarecorder-polyfill库补全Safari的MediaRecorder支持，统一用原生API开发
• MediaStreamRecorder：另一个专注跨浏览器兼容的轻量录制库，对Safari的适配逻辑比RecordRTC更简洁

优先推荐先尝试调整RecordRTC的格式和录制器配置，这是成本最低的修复方案；如果仍有兼容性问题，再考虑迁移到Twilio或其他库。

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