expo-av音频播放避坑指南：从本地文件加载到内存泄漏预防全解析

Expo-AV音频播放避坑指南：从本地文件加载到内存泄漏预防全解析

在构建现代移动应用时，音频功能往往是提升用户体验的关键一环。无论是社交应用中的消息提示音、教育应用中的单词发音，还是游戏中的背景音乐与音效，流畅、稳定的音频播放能力都至关重要。对于使用 React Native 和 Expo 生态的开发者而言，expo-av 库是处理音频任务的首选工具。它封装了跨平台的音频能力，让开发者能够以相对统一的方式调用设备硬件。然而，从简单的“点击播放”到复杂的“动态音频队列管理”，中间横亘着许多容易忽视的陷阱。许多开发者，尤其是从中级向高级进阶的开发者，常常在实现了基础功能后，便遭遇了音频无法播放、资源未释放导致应用卡顿甚至崩溃的棘手问题。这些问题在需要长期运行或频繁切换音频的应用场景中尤为突出。本文将深入剖析 expo-av 在实际开发中的核心难点，不仅告诉你如何“正确地”播放一个本地音频文件，更将系统性地拆解音频 URI 的生成逻辑、跨平台兼容性的处理策略，并重点探讨如何构建健壮的音频资源管理机制，彻底预防 React Native 应用中令人头疼的音频内存泄漏问题。

1. 理解音频源：URI 的生成与跨平台兼容性

音频播放的第一步，是告诉播放器“声音在哪里”。在 expo-av 中，这通过 uri 参数实现。一个错误的 URI 是导致音频加载失败最常见的原因。许多开发者直接从网络或文档中复制代码，却忽略了 URI 在不同平台和不同文件来源下的细微差异。

1.1 本地文件 URI 的生成原理

在 Expo 应用中，本地文件通常存储在几个特定的目录中，每个目录有不同的用途和生命周期。expo-file-system 库提供了访问这些目录的路径常量。

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

console.log(FileSystem.documentDirectory);   // 应用文档目录，用户数据，可被iCloud备份（iOS）
console.log(FileSystem.cacheDirectory);      // 应用缓存目录，临时文件，系统可能清理
console.log(FileSystem.bundleDirectory);     // 应用资源目录，只读，打包时放入的静态资源

对于需要动态播放的音频文件，我们通常需要将它们放置在 documentDirectory 或 cacheDirectory 中。一个常见的误区是直接拼接字符串来构造 URI。虽然 FileSystem.documentDirectory + ‘audio.mp3’ 在大多数情况下能工作，但更健壮的做法是使用 FileSystem 提供的方法来构建路径，以确保路径分隔符的正确性（Windows与Unix系统不同）。

注意：bundleDirectory 是只读的，适用于应用内置的、不会改变的音频资源。如果你需要在应用运行后下载或生成新的音频文件，必须使用 documentDirectory 或 cacheDirectory。

1.2 处理不同来源的音频文件

你的音频文件可能来自多个渠道，每种渠道都需要特定的处理方式才能被 expo-av 正确加载。

对于网络音频，一个完整的下载与播放流程示例如下：

import * as FileSystem from 'expo-file-system';
import { Audio } from 'expo-av';

const playAudioFromNetwork = async (remoteUrl, localFileName) => {
  try {
    // 1. 构造