React Native Video 组件卸载时导致 AVPlayer 意外停止的问题解析

问题现象

在 React Native 应用开发中，当同时使用 react-native-video 组件和 react-native-sound-player (基于 AVPlayer) 播放音频时，开发者可能会遇到一个特殊问题：当视频组件被卸载(unmount)时，原本在后台播放的音频也会意外停止。

技术背景

在 iOS 平台上，AVFoundation 框架提供了 AVPlayer 类来处理媒体播放。当多个 AVPlayer 实例同时存在时，它们的播放行为会受到音频会话(AVAudioSession)配置的影响。react-native-video 和 react-native-sound-player 都基于 AVPlayer 实现，因此它们的交互需要特别注意。

问题原因分析

1. 音频会话冲突：虽然开发者已经设置了 AVAudioSessionCategoryAmbient 和 AVAudioSessionCategoryOptionMixWithOthers 选项，但当视频组件卸载时，可能会触发音频会话的重新配置。

2. 组件生命周期影响：react-native-video 组件在卸载时会自动停止播放并释放相关资源，这个过程中可能会干扰其他 AVPlayer 实例。

3. 默认行为限制：当前版本的 react-native-video 设计上会在组件卸载时停止播放，这是为了确保资源的正确释放和避免内存泄漏。

解决方案

推荐方案：调整组件层级结构

将视频播放器组件放置在屏幕堆栈之外，作为全局组件管理。这样即使导航切换页面，视频组件也不会被卸载，从而避免影响音频播放。

// 示例代码 - 将视频组件放在应用顶层
function App() {
  return (
    <>
      <NavigationContainer>
        {/* 你的导航结构 */}
      </NavigationContainer>
      <GlobalVideoPlayer />
    </>
  );
}

备选方案：自定义组件卸载行为

如果必须将视频组件放在页面内部，可以考虑以下方法：

1. 使用状态管理：通过 Redux 或 Context 全局管理播放状态
2. 自定义卸载逻辑：重写组件卸载方法，避免影响其他播放器

最佳实践建议

1. 音频会话配置：确保在 AppDelegate.m 中正确配置音频会话
2. 版本升级：考虑升级到最新版 react-native-video (当前为 6.11.0)
3. 播放器隔离：对于需要同时播放的多媒体内容，建议使用专门的音频管理方案

技术深度解析

在 iOS 系统中，AVAudioSession 管理着应用的音频行为。当多个 AVPlayer 实例共存时，系统会根据以下因素决定音频行为：

• 音频会话类别 (Category)
• 会话选项 (Options)
• 各个播放器的配置参数
• 应用的生命周期事件

react-native-video 组件默认设计为"自包含"模式，即在组件卸载时自动清理资源。这种设计虽然保证了资源管理的严谨性，但在复杂场景下可能需要开发者进行额外处理。

总结

理解 iOS 音频会话机制和 React Native 组件生命周期对于处理多媒体播放问题至关重要。通过合理设计组件结构和正确配置音频参数，开发者可以避免这类播放冲突问题，为用户提供流畅的多媒体体验。