React Native Video 在 Android 构建后无法播放视频的问题分析

问题现象

在使用 React Native Video 6.6.2 版本时，开发者在 Android 平台上遇到了一个典型问题：在开发模式下视频播放正常，但在构建发布版本后却无法播放，控制台报错显示"Playback error"和"ExoPlaybackException: Source error"。

错误详情

错误堆栈显示核心问题是"Malformed URL"，具体表现为：

1. 使用 require 导入本地视频资源时出现 URL 格式错误
2. 错误发生在 ExoPlayer 尝试处理数据源时
3. 问题与缓存配置(bufferConfig)有关

根本原因分析

经过深入分析，这个问题主要由以下几个因素共同导致：

1. 资源路径处理问题：React Native 的 require 语法在构建后生成的资源路径可能与预期不符，特别是使用了非标准路径符号(~)时。

2. 缓存配置冲突：当设置了 bufferConfig.cacheSizeMB 属性时，播放器会尝试对本地文件进行缓存处理，这在技术逻辑上是不合理的，因为本地文件不需要额外的缓存机制。

3. URI 传递方式不当：直接使用 require 返回的结果作为 uri 参数值，而不是使用 source={require()} 的标准方式。

解决方案

针对这个问题，开发者可以采取以下几种解决方案：

1. 移除缓存配置：最简单有效的解决方案是移除 bufferConfig 配置项，让播放器使用默认的缓存行为。

2. 使用标准资源路径：避免使用 ~ 等非标准路径符号，改用相对路径引用资源文件。

3. 正确使用 require：采用标准的 source={require('path/to/video.mp4')} 语法，而不是将其嵌套在 uri 属性中。

技术建议

对于需要在 Android 平台上使用 React Native Video 的开发者，建议：

1. 对于本地视频资源，优先使用标准的 require 导入方式
2. 谨慎使用缓存配置，特别是对本地文件
3. 在发布前充分测试构建版本的功能
4. 考虑实现错误边界处理，优雅地处理可能的播放错误

总结

这个问题揭示了 React Native 生态中资源加载和原生模块交互的一些微妙之处。理解底层机制（如 ExoPlayer 的工作方式）对于解决这类问题很有帮助。开发者应当注意遵循最佳实践，特别是在资源引用和模块配置方面。