使用 react-native-audio-recorder-player 和 RNFetchBlob 播放远程音频不工作 iOS

Question

我正在开发 React Native 应用程序，我需要从后端加载音频文件并在应用程序中播放。

为此我使用了软件包 RNFetchBlob and react-native-audio-recorder-player.

问题是我的实现在 Android 上完美运行，但在 iOS[=37 上不起作用=]... 即使播放使用 iOS 本身内的 react-native-audio-recorder-player 录制的文件。

播放使用RNFetchBlob下载的文件时出现以下错误：

FigFileForkOpenMainByCFURL signalled err=2 (errno) (open failed) at /Library/Caches/com.apple.xbs/Sources/EmbeddedCoreMediaFramework_Sim/EmbeddedCoreMedia-2765.6/Sources/Platform/Darwin/DarwinFile.c:576

重要的代码部分：

import AudioRecorderPlayer from 'react-native-audio-recorder-player';
import RNFetchBlob from 'rn-fetch-blob';

// THIS IS A SAMPLE, NOT THE REAL URL AND TOKEN.
const fileRemoteUrl = 'https://my-backend.com/files/file-id';
const authToken = 'my-authtoken';

// could be 'mp3' or 'aac', etc...
const fileExtension = 'm4a'; 

const dir = NFetchBlob.fs.dirs.DocumentDir;
const path = `${dir}/${Base64.btoa(fileRemoteUrl)}.${fileExtension}`;

const res = await RNFetchBlob.config({
    fileCache: false,
    appendExt: fileExtension,
    path,
}).fetch('GET', fileRemoteUrl, { Authorization: `Bearer ${authToken}` });

const internalUrl = `${Platform.OS === 'android' ? 'file://' : ''}${res.path()}`;

const audioRecorderPlayer = new AudioRecorderPlayer();
await audioRecorderPlayer.startPlayer(internalUrl);
// here the audio should start playing,
// but I get the error on the device(simulator) console (xcode output)

正如我之前所说，相同的代码 在 Android 上的效果非常好 。 知道如何解决这个问题吗？我被困在这个... 感谢您的帮助！

Answer 1

最后我发现问题出在这一行：

const internalUrl = `${Platform.OS === 'android' ? 'file://' : ''}${res.path()}`;

对于iOS和Android都需要添加前缀“file://”到文件路径，然后再传递给“startPlayer”方法。

我之前只在 Android 上添加前缀的原因是因为我使用相同的代码片段来加载其他格式的文件（不是音频）。例如，要在 iOS 上使用组件“”，uri 不能有前缀。

所以解决方案是在平台为 iOS 时创建一个特定的处理来添加前缀，就在调用“startPlayer" 方法。