使用 source => {uri: 'remote-file-path'} 播放音频文件不起作用 - React Native（expo）

Question

当我尝试播放本地后端的音频或已从网站上传的音频时，我不断收到此错误。无论什么文件格式，这都是我得到的，这只发生在 ios

错误：Possible Unhandled Promise Rejection (id: 0): Error: The server is not correctly configured. - The AVPlayerItem instance has failed with the error code -11850 and domain "AVFoundationErrorDomain". Error: The server is not correctly configured. - The AVPlayerItem instance has failed with the error code -11850 and domain "AVFoundationErrorDomain". error image

const player = new Audio.Sound();
player.loadAsync({ uri: url }, initialStatus).then(() => {
    player.playAsync().then((playbackStatus) => {
        if (playbackStatus.error) {
                                 
          handlePlaybackError(playbackStatus.error);
        }
    });
});

添加更多错误处理后，我发现错误来自 loadAsync，并且仅当我尝试从本地后端服务器播放音频时才会发生。 (ex: http://127.0.0.1:8000/media/audios/2021/08/08/27/21/filename.mp4)

如果我能得到这方面的帮助，那就太好了，在此先感谢！更新：提供了更多代码

Answer 1

loadAsync() returns 一个 Promise，因此您必须等待它。如果这不是问题，请提供更多代码。

这里是documentation，所以这样使用：

const sound = new Audio.Sound();
try {
  await sound.loadAsync(require('./assets/sounds/hello.mp3'));
  await sound.playAsync();
  // Your sound is playing!

  // Don't forget to unload the sound from memory
  // when you are done using the Sound object
  await sound.unloadAsync();
} catch (error) {
  // An error occurred!
}

这是我做的一个简单点心，它对我有用，你可能想考虑使用 try-catch 进行错误处理： Snack example

Answer 2

所以我发现正在生成该警告并阻止我的音频文件播放，因为它们存储在我的本地服务器中，并且出于某种原因，expo Audio.Sound 对象在加载它们时出现问题，所以我必须安装 expo-file-system，使用 FileSystem 读取下载文件并使用从下载中生成的 uri。示例：

import * as FileSystem from 'expo-file-system';

    const splitUrl = url.split('/');
    const lastItem = splitUrl[splitUrl.length - 1];
    const { uri } = await FileSystem.downloadAsync(
        url,
        FileSystem.documentDirectory + lastItem
    );
    const source = { uri: uri }; //the source you provide to the loadAsync() method

使用 source => {uri: 'remote-file-path'} 播放音频文件不起作用 - React Native（expo）

Playing an audio file with source => {uri: 'remote-file-path'} not working - React Native (expo)

react-native

expo

expo-av