react-native-sound icon indicating copy to clipboard operation
react-native-sound copied to clipboard

The recorded base64 not working on IOS

Open DevJett opened this issue 5 years ago • 4 comments

  • "rn-fetch-blob": "^0.10.15",
  • "react": "16.8.3",
  • "react-native": "^0.59.10",
  • "react-native-sound": "^0.10.12",

I have run into some trouble using writeFile method with base64 generated from javascript blob voice recorder jsfiddle link

I'm using react-native-sound to play the file and when I'm trying to run the file I got error says

{code: "ENSOSSTATUSERRORDOMAIN2003334207", message: "The operation couldn’t be completed. (OSStatus error 2003334207.)", nativeStackIOS: Array(17), domain: "NSOSStatusErrorDomain", userInfo: {…}}

This error occurs when you are trying to access a file that is not present in the specified folder or can not be downloaded from a network.

I've tried on android it works perfectly but on IOS I got that error I don't know where to post this problem actually

Note: I successfully got the file URL with a length without any errors but the package react-native-sound says there's an error with a file, I've tried a base64 recorded from **'react-native-audio'** it works perfectly on both IOS & Android using writeFile method but the generated base64 from the fiddle link it doesn't work

    createFile = () =>{
        const file = RNFetchBlob.fs.dirs.CacheDir + `/${Math.random().toString(36).substring(7)}.wav`;
        let self = this;
        let base64 = this.props.path;
        RNFetchBlob.fs.writeFile(file, base64, 'base64')
            .then((len) => {
                console.log('qr image to ' + file + ' with len ' + len);
                self.setState({url: file});
            })
            .catch((reason) => {
                // console.log('ex: ' + reason);
            })
    };

    play = async () => {
        if(this._sound){
            this._sound.play(this.playComplete);
            this.setState({playState:'playing'});
        }else{
            const filepath = 'https://raw.githubusercontent.com/zmxv/react-native-sound-demo/master/frog.wav'; // working both on IOS and Android
            setTimeout(() => {

                this._sound = new Sound(this.state.url, '', (error) => {
                    if (error) {
                        console.log('failed to load the sound', error);
                        Alert.alert('Notice', 'audio file error. (Error code : 1)'); // shows this error
                        console.log(' sound', this._sound); // load sound shows false
                        this.setState({playState: 'paused'});
                    } else {
                        console.log('sound2', this._sound);
                        this.setState({playState: 'playing', duration: this._sound.getDuration()});
                        this._sound.play(this.playComplete);
                    }
                });
            }, 1000);
        }
    };

DevJett avatar Feb 23 '20 21:02 DevJett

Hi,

I've the same problem. Do you have news?

Thanks.

lucaisoardi avatar Mar 05 '20 15:03 lucaisoardi

@lucaisoardi I can't find a solution yet. Please if you find a solution for that post it here I think this problem related to rn-fetch-blob

DevJett avatar Mar 06 '20 05:03 DevJett

@lucaisoardi I can't find a solution yet. Please if you find a solution for that post it here

DevJett avatar Jul 01 '20 23:07 DevJett

Hi,

The only way that i find is to generate the mp3 server side and then play it on the app.

const sound = new Sound(resp.audio, null, (error) => { if (error) { console.log('failed to load the sound', error); return; } sound.play(() => { this.props.toggleSpeaking(false); fs.unlink(resp.audio); this.setState({ isPlaying: false, }); }); });

lucaisoardi avatar Jul 02 '20 09:07 lucaisoardi