url.toLowerCase is not a function in soundmanager2.js [I'm using import Sound from 'react-sound']

445 views Asked by At

When I try to download a file and then put in the Sound component of 'react-sound' I get this error:

url.toLowerCase is not a function
    at html5CanPlay (soundmanager2.js:4262)
    at html5OK (soundmanager2.js:4169)
    at SoundManager.createSound (soundmanager2.js:539)
    at call (index.js:59)
    at index.js:43
    at Array.forEach (<anonymous>)
    at index.js:42
    at processOnEvents (soundmanager2.js:4920)
    at soundmanager2.js:4947

I want to point out that this code work fine if I import a file from my assets (a file saved in my folder).

I'm using react and my code is:

class Example extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            soundfile: null
        }
    }

    componentDidMount() {
        this.setState({soundfile: this.getFile()});
    }

    getFile = async () => {
        const audioFile = 'gs://MY_FILE_FROM_FIRESTORE';
        let url = await storage.refFromURL(audioFile).getDownloadURL();
        console.log(url);
        let response = await fetch(url);
        console.log(response);
        let body = response.body;
        console.log(body);
        return body;
    }


    render() {
        return(
            <div>
                <p> test </p>
                {this.state.soundfile ? <Sound
                    autoLoad={true}
                    url={this.state.soundfile}
                    playFromPosition={0}
                    playStatus={Sound.status.PLAYING}
                /> : null}
            </div>
        )
    }
}

How can I solve this problem?

0

There are 0 answers