How to play audio from a local file?

Hi,

My app downloads and saves audio files using FileSystem.createDownloadResumable, this works.

Later, I want the user to be able to play the downloaded sound. How do I do this? I’ve tried different things, like:

export default async (file) => {

    console.log('Trying to play sound...', file)

    const soundObject = new Audio.Sound();
    try {
        await soundObject.loadAsync({
            uri: file
        });
        await soundObject.playAsync();
        // Your sound is playing!
    } catch (error) {
        // An error occurred!
    }
}

or

export default async (file) => {
    
    console.log('Trying to play sound...', file)

    const soundObject = new Audio.Sound();
    try {
      await soundObject.loadAsync(file);
      await soundObject.playAsync();
      // Your sound is playing!
    } catch (error) {
      // An error occurred!
    }
}

or

export default async (file) => {
    
    console.log('Trying to play sound...', file)

    const soundObject = new Audio.Sound();
    try {
      await soundObject.loadAsync(require(file));
      await soundObject.playAsync();
      // Your sound is playing!
    } catch (error) {
      // An error occurred!
    }
}

In every example, the “file” parameter is a string, something like “file:///var/mobile/Containers/Data/Application/3B6A…sound.mp3”.

What am I doing wrong here? The documentation doesn’t provide any useful examples for this case.

1 Like

Have you tried console.logging the error? Does it catch anything and is it useful?

Did you ever get this to work? I’m trying to play a file I’ve downloaded before, but I cannot see how it can be done.

Did you get this to work? I am trying to do the same thing and only see documentation for hardcoded file paths.

1 Like

@stefvw93 @juancarlosfarah @ldwight you have to pass it in with the format of a network URL. You are trying to require it, which makes it look to the wrong place-- the docs say with a network URL pointing to an audio file on the web. but it works with filesystem URLs as well. https://docs.expo.io/versions/v28.0.0/sdk/audio#a-dictionary-of-the-form--uri

Also, here is an example: https://github.com/expo/loop/blob/master/screens/Project/components/Track/index.js#L48

1 Like

Thank you, @quinlanj - I will give this a try!

I spent 2 days to find out the solution and now I’m here. Like the title of this topic, I have downloaded mp3 audio files using FileSystem.downloadAsync function. I stored the download files in FileSystem.documentDirectory and everything worked fine. But I got an issue when I played my audio files from FileSystem.documentDirectory.
This is my code:

 async _onPressPlaySound(soundUri) {
    //sound uri: https://mytestAPI.com/audio/32313123/l_gbspeaking.mp3
    var arr = soundUri.toString().split("/");     console.log(`uri for sound: ${soundUri}`);     var filename= arr[arr.length-1];
   
     FileSystem.downloadAsync(soundUri, FileSystem.documentDirectory+ filename)
               .then(({uri})=>{
                 console.log("finished downloading to", uri)
               })
               .catch(error=>{
                 console.error(error);
               });
     
   
     const sound = new Audio.Sound();
     try {
       await sound.loadAsync(require(FileSystem.documentDirectory+filename));
       await sound.playAsync();
       // Your sound is playing!
     } catch (error) {
       // An error occurred!
     }
   }

I hope everyone can give me some advices. Thanks!

Just

sound.loadAsync({ uri: Expo.FileSystem.documentDirectory+filename }) 
2 Likes