React Native Android本地缓存HLS视频无法播放问题求助

以下是针对问题的具体排查步骤和解决方案：

核心排查方向 #

单个本地TS文件、云端HLS均可正常播放，但本地HLS的m3u8报错，核心原因基本集中在m3u8内分片路径配置错误或播放器对本地HLS的支持配置缺失。

1. 检查本地m3u8文件的分片路径 #

下载后的m3u8大概率仍保留云端TS分片的URL，而非本地路径，导致播放器尝试从网络加载分片触发错误：

• 找到缓存目录中的playlist.m3u8文件，打开查看内容
• 若看到类似https://xxx.com/high0.ts的云端路径，必须替换为对应的本地file://路径，例如：

  #EXTINF:10.0,
  file:///storage/emulated/0/Android/data/com.charub/cache/videos/video_1712660382226/high0.ts
  

• 注意：Android文件名区分大小写，需保证m3u8中的文件名和本地缓存的TS文件名完全一致

2. 验证本地m3u8的播放路径格式 #

播放本地m3u8必须使用完整的file://协议前缀，不能直接用绝对路径：

• 错误示例：/storage/emulated/0/Android/data/com.charub/cache/.../playlist.m3u8
• 正确示例：file:///storage/emulated/0/Android/data/com.charub/cache/.../playlist.m3u8

3. 检查播放器组件的配置 #

如果使用第三方Video组件（如React Native Video），需确保其支持本地HLS播放：

• 若基于ExoPlayer开发，需使用DefaultDataSourceFactory而非仅支持网络的OkHttpDataSourceFactory，保证播放器能读取本地文件
• React Native Video组件的source属性需正确配置：

  <Video
    source={{ uri: 'file:///storage/emulated/0/Android/data/com.charub/cache/videos/video_1712660382226/playlist.m3u8' }}
    resizeMode="cover"
    // 其他必要配置
  />
  

4. 确认文件完整性 #

虽然已确认m3u8存在，仍需验证所有TS分片是否完整下载：

• 对照m3u8中的分片列表，逐一检查缓存目录是否存在对应TS文件
• 可临时修改m3u8，仅保留一个已确认可播放的本地TS路径，再播放该m3u8，若能正常播放则说明是分片路径问题，否则需排查播放器配置

解决方案总结 #

最有效的解决流程：

1. 下载m3u8后，自动替换所有云端分片URL为本地file://路径
2. 使用完整的file://协议路径加载本地m3u8
3. 确保播放器配置支持本地文件读取

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