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?