企业官网建设流程全解析

MediaMTX 移动端流媒体集成：WebRTC 与 HLS 选型 + 落地配置清单

【免费下载链接】mediamtxReady-to-use Media-over-QUIC / SRT / WebRTC / RTSP / RTMP / LL-HLS / MPEG-TS / RTP live media server and media proxy that allows to read, publish, proxy, record and playback real-time video and audio streams.项目地址: https://gitcode.com/GitHub_Trending/me/mediamtx

MediaMTX 是一个开箱即用的流媒体服务器，支持 WebRTC、HLS、LL-HLS、SRT、RTMP、MoQ 等协议，一条流推上去即可同时以多种协议输出。移动端流媒体集成中最常见的卡点其实只有两个：选错协议，以及 mediamtx.yml 没配好。这篇文章直接给结论：先按延迟需求定协议，再改服务器配置，最后在 iOS / Android 上各写不超过 20 行的客户端代码。

🧭 第一步：按延迟和场景定协议

MediaMTX 同时输出多条流，但移动端播放只建议从下面三个选项里挑。选型标准就一条：能接受多大延迟。

决策路径很直接：

• 延迟必须压到 1s 内 → WebRTC，iOS 端走 WHEP（WebRTC-HTTP Egress Protocol，通过一次 HTTP POST 完成信令握手）接入，见下文。
• 需要覆盖老设备或流量要走 CDN → LL-HLS。
• 只是"播出去"、不在乎几秒延迟 → 标准 HLS。

注意：RTSP/RTMP 在 iOS 上需要额外引入第三方库且播放链路更长，本文不展开；协议细节可查 docs/2-features/04-read.md。

⚙️ 动手前改好 mediamtx.yml

客户端写多少代码都救不了服务器默认值。仓库里的 mediamtx.yml 默认已开启 webrtc 和 hls，但 LL-HLS 的加密开关是关的、part 时长偏大，按下面这几项改（只列与移动端直接相关的）：

webrtc: true # 启用 WebRTC 服务，默认监听 8889 webrtcEncryption: true # 启用 HTTPS/WHEP 握手（正式环境必开） webrtcLocalUDPAddress: :8189 # UDP/ICE 监听地址，媒体流主要走这里 hls: true # 启用 HLS 服务，默认监听 8888 hlsVariant: lowLatency # LL-HLS 变体；全兼容场景可改 mpegts hlsSegmentDuration: 1s # 最小分片时长 hlsPartDuration: 200ms # 最小 part 时长，直接决定 LL-HLS 延迟下限

几个容易忽略的点（完整配置参考）：

• Apple 设备播放 LL-HLS 强制要求 HTTPS。hlsEncryption: true并配好hlsServerKey/hlsServerCert，否则 iOS 端只能退回标准 HLS，延迟立刻变 2s 起步。
• 延迟下限约等于hlsPartDuration × 3 + 一个分片（播放器通常缓冲 3 个 part）。想压延迟就调小 part，而不是调hlsSegmentCount——后者只影响可回看长度，不影响延迟。
• WebRTC 媒体面默认走 UDP:8189，防火墙/云安全组记得放行。

📱 iOS：用 WHEP 接入 WebRTC 播放

iOS 端引入 Google 的 WebRTC SDK（CocoaPods 添加GoogleWebRTC），MediaMTX 的 WHEP 端点是http(s)://<server>:8889/<path>/whep：客户端生成 SDP offer，POST 到该端点，服务端返回 answer，握手完成。最小骨架：

func sendOffer(_ sdp: String) { var req = URLRequest(url: URL(string: "https://server:8889/mystream/whep")!) req.httpMethod = "POST" req.setValue("application/sdp", forHTTPHeaderField: "Content-Type") // 坑点：必须是 sdp 类型 req.httpBody = sdp.data(using: .utf8) URLSession.shared.dataTask(with: req) { data, resp, _ in guard let data, let sdp = String(data: data, encoding: .utf8) else { return } let answer = RTCSessionDescription(type: .answer, sdp: sdp) self.peerConnection.setRemoteDescription(answer) { _ in } }.resume() }

其余就是标准 WebRTC 流程：创建RTCPeerConnection时约束OfferToReceiveAudio/Video = true，收到远端流后把 videoTrack 挂到RTCVideoView渲染、audioTrack 交给播放器出声，完整握手与渲染代码见 docs/4-read/03-webrtc.md。调试技巧：直接浏览器访问http://<server>:8889/<path>会打开 MediaMTX 自带的 WebRTC 播放测试页，先确认服务端出流正常，再动 App 代码。

🤖 Android：用 ExoPlayer 拉取 LL-HLS 流

Android 端推荐 ExoPlayer 播放 LL-HLS（对低延迟模式支持完善），build.gradle添加：

implementation 'com.google.android.exoplayer:exoplayer-core:2.19.1' implementation 'com.google.android.exoplayer:exoplayer-hls:2.19.1'

拉流骨架只有几行，关键是开启低延迟模式：

val player = ExoPlayer.Builder(context).build() val item = MediaItem.fromUri("https://server:8888/mystream/index.m3u8") player.setMediaSource(player.createMediaSourceFactory().createMediaSource(item)) player.prepare() player.play()

注意两个坑：低延迟模式要求播放地址是HTTPS（与 Apple 设备同一条规则），服务器端hlsVariant: lowLatency也要就位，二者缺一都会静默退化成标准 HLS，延迟从 1s 变 5s 而你很难察觉。Android 若也要亚秒级延迟，可换 Google 的google-webrtcSDK 走与 iOS 相同的 WHEP 流程（createOffer→ POST →setRemoteDescription），实现上只是 API 名不同。

🪤 三个最常踩的坑

1. LL-HLS 在 iOS 上"不低延迟"：九成是hlsEncryption没开。Apple 平台对 LL-HLS 的 part 请求强制 HTTPS，明文 HTTP 下客户端会直接放弃低延迟特性。
2. WebRTC 握手成功但媒体连不上：信令走 HTTP、媒体走 UDP（:8189），内网/对称 NAT 环境下要配 STUN（webrtcICEServers2），必要时开webrtcLocalTCPAddress让 ICE 有 TCP 兜底。排障方法见 docs/2-features/25-webrtc-specific-features.md 的 "Solving WebRTC connectivity issues" 一节。
3. 压了 partDuration 延迟却没降：分片最终时长受源流关键帧间隔（GOP）制约，服务器会把分片拉长到至少包含一个 IDR 帧。推流端用-g 25之类的参数把 GOP 压到 1s 以内，LL-HLS 的延迟优化才真正生效。

一句话决策：要 1s 内延迟选 WebRTC（WHEP 接入，注意 UDP 端口与 ICE 配置），要覆盖广或走 CDN 选 LL-HLS（HTTPS + 小 part + 小 GOP 三件套），对延迟不敏感就用标准 HLS。服务器侧把 mediamtx.yml 里那 8 行改对，客户端工作量其实很小。

【免费下载链接】mediamtxReady-to-use Media-over-QUIC / SRT / WebRTC / RTSP / RTMP / LL-HLS / MPEG-TS / RTP live media server and media proxy that allows to read, publish, proxy, record and playback real-time video and audio streams.项目地址: https://gitcode.com/GitHub_Trending/me/mediamtx