expo-av mp3 playback not working on iOS 16

[ninac]

Please provide the following:

1. SDK Version: 46
2. Platforms(Android/iOS/web/all): iOS 16.0, iOS 16.1
3. Add the appropriate “Tag” based on what Expo library you have a question on.

My app loads mp3 files from the asset folder using expo-asset, and uses Audio.Sound from expo-av to play the audio. I’m using the playAsync() and pauseAsync functions to control the audio playback and using the AVPlaybackStatus to display position & duration. The app functions correctly on iOS 15.6 on iPhone & iPad. When I tried it on iOS 16 & iOS 16.1 on iPhone, I do not hear any audio. The file seems to have loaded correct, and I’m getting a successful AVPlaybackStatus back and it’s correctly displaying the position & duration. The position progresses correctly when I play and stops when pause, but I don’t actually hear any sound.

I’m on expo-av version 12.0.4

I’m wondering if something changed in this iOS version and I need some additional permissions or settings to access device audio?

Here’s the relevant code:

export function Home() {
  const [assets, assetError] = useAssets([require('../assets/Music-Bells.mp3')]);
  const [musicTrack, setMusicTrack] = useState<Audio.Sound>();
  const [playbackStatus, setPlaybackStatus] = useState<AVPlaybackStatusSuccess>();

  const loadMusicTrack = async () => {
    const { sound } = await Audio.Sound.createAsync(
      assets[0],
      {}, // Default initial AVPlayback status.
      (status: AVPlaybackStatus) => {
        if (status.isLoaded) {
          setPlaybackStatus(status as AVPlaybackStatusSuccess);
        }
      },
    );
    setMusicTrack(sound);
  };

  useEffect(() => {
    if (assets && assets.length > 0) {
      loadMusicTrack();
    }
  }, [assets]);

  const play = () => {
    if (musicTrack) {
      musicTrack.playAsync();
    }
  };

  const pause = () => {
    if (musicTrack) {
      musicTrack.pauseAsync();
    }
  };

  const formatMillis = (millis: number) => {
    return prettyMilliseconds(millis, {
      colonNotation: true,
      secondsDecimalDigits: 0,
    });
  };

  return(
    <View className="flex-1 justify-center items-center bg-black">
      { !playbackStatus?.isPlaying && (
        <TouchableOpacity onPress={() => play()} >
          <Ionicons name="play-circle-outline" size={256} color="#fff" />
        </TouchableOpacity>
      )}
      { playbackStatus?.isPlaying && (
        <TouchableOpacity onPress={() => pause()} >
          <Ionicons name="pause-circle-outline" size={256} color="#fff" />
        </TouchableOpacity>
      )}
      {
        playbackStatus && (
          <View className="flex-row">
            <Text className="text-2xl text-white mr-2.5">
              {formatMillis(playbackStatus.positionMillis) + " / " + formatMillis(playbackStatus.durationMillis)}
            </Text>
            <TouchableOpacity onPress={() => rewind()} >
              <Ionicons name="play-back" size={32} color="#ffffff" />
            </TouchableOpacity>
          </View>
        )
      }
    </View>
  );