Expo(React Native)应用后台运行时音频控制实现方案咨询

原生支持现状 #

目前Expo SDK 46及以上版本已经原生支持锁屏、系统通知栏、控制中心的音乐后台控制能力，2017年资料提到的不支持问题早已解决，不需要eject出原生项目即可实现。

基于expo-av的官方实现步骤 #

你已经配置的staysActiveInBackground: true是后台播放的基础，在此之上补充以下配置和代码即可接入后台控制：

• 补全音频模式全局配置

import { Audio } from 'expo-av';

await Audio.setAudioModeAsync({
  staysActiveInBackground: true,
  playsInSilentModeIOS: true, // iOS端必配，保证静音开关开启时仍能播放
  shouldDuckAndroid: true,
  allowsRecordingIOS: false,
});

• 配置app.json的后台权限，不需要修改原生代码：

{
  "expo": {
    "ios": {
      "infoPlist": {
        "UIBackgroundModes": ["audio"]
      }
    },
    "android": {
      "permissions": ["FOREGROUND_SERVICE_MEDIA_PLAYBACK"]
    }
  }
}

• 加载音频时同步设置媒体元数据，系统会自动将歌曲名、歌手、封面等信息展示在系统控制界面：

const { sound } = await Audio.Sound.createAsync(
  { uri: '你的音频资源地址' },
  { shouldPlay: true },
  playbackStatusUpdateCallback
);

// 设置控制中心展示的媒体信息
await sound.setNowPlayingAsync({
  title: '歌曲标题',
  artist: '歌手名称',
  artwork: '专辑封面URL',
  duration: 音频总时长（毫秒值）
});

• 注册系统控制事件监听，即可响应后台的播放、暂停、停止、切歌操作：

Audio.addPlaybackListener((event) => {
  switch (event.type) {
    case 'play':
      sound.playAsync();
      break;
    case 'pause':
      sound.pauseAsync();
      break;
    case 'stop':
      sound.stopAsync();
      break;
    case 'nextTrack':
      // 自定义下一首切换逻辑
      break;
    case 'previousTrack':
      // 自定义上一首切换逻辑
      break;
  }
});

以上配置在Expo Go调试环境、正式生产包中均可正常生效。

进阶可选方案 #

如果你需要更复杂的后台控制能力，比如自定义通知栏按钮、缓存策略、长音频/播客场景的稳定性优化，可以选择以下不需要eject的方案：

• 基于expo-notifications自定义媒体样式通知，自行绑定通知按钮点击事件触发播放控制，灵活度最高
• 接入带Expo插件支持的react-native-track-player，该库专门针对音乐播放场景做了优化，后台控制、音频焦点管理、车载系统适配的成熟度高于expo-av，安装时配置对应插件即可直接使用。

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