Play sound in iOS device in react-native

Question

In my app I have a feature that plays a sound when a message is received it will notify the user by playing a sound file, the app works using react-native-sound fine in Android but in iOS I keep getting this error:

Code I am using for initializing the sound:

import Sound from "react-native-sound"

// Load the sound file 'whoosh.mp3' from the app bundle
// See notes below about preloading sounds within initialization code below.
var message_received = new Sound(require("../../res/audio/Page_Turn.mp3"), Sound.MAIN_BUNDLE, (error) => {
    if (error) {
      console.log('failed to load the sound', error);
      return;
    }
    // loaded successfully
    console.log('duration in seconds: ' + message_received.getDuration() + 'number of channels: ' + message_received.getNumberOfChannels());
});

The method that I call after initializing sound file:

message_received.play()

Does anyone know how to solve this?

from react-native-sound doc: iOS: Open Xcode and add your sound files to the project (Right-click the project and select Add Files to [PROJECTNAME]). Then you can call it like new Sound('Page_Turn.mp3', — Ilario
the error appears when you do .play() or when you init the sound? — Ilario

Phat Le Phat Le · Accepted Answer · 2019-11-14T02:47:01

If you use require(filepath), you don't need Sound.MAIN_BUNDLE, the second param is callback:

new Sound(require("../../res/audio/Page_Turn.mp3"), (error) => {})
play function should be called after initialising successfully

var message_received = new Sound(require("../../res/audio/Page_Turn.mp3"), (error) => { if (error) { console.log('failed to load the sound', error); return; } // loaded successfully message_received.play() });
Remember to add(references) your .mp3 files into xcode, re-run react-native run-ios.

This code example contains many use-cases: https://github.com/zmxv/react-native-sound-demo/blob/master/main.js

Play sound in iOS device in react-native

2 Answers