Я работаю над проектом, для которого пользователь должен что-то записать, а затем у него есть возможность услышать это.
Я установил реагирующий микрофон с npmjs.com:
https://www.npmjs.com/package/react-mic
В приведенной выше ссылке они поделились демо: https://hackingbeauty.github.io/react-mic/
Демо имеет возможность записать, остановить и в конечном итоге воспроизвести вашу запись.
Мне удалось реализовать кнопки запуска и остановки, запись, кажется, работает нормально, но я не понимаю двух вещей:
- Где эта запись сохраняется?
- Послепри нажатии кнопки «Стоп» в консоли появляется blobURL.Я предполагаю, что запись сохранена в этом BLOB-объекте, но как мне ее получить?Копирование, вставка blobURL не работает.
Мой код выглядит так же, как их предложение на npmjs.com
startRecording = () => {
this.setState({record: true});
}
stopRecording = () => {
this.setState({record: false});
}
onData(recordedBlob) {
console.log('chunk of real-time data is: ', recordedBlob);
}
onStop(recordedBlob) {
console.log('recordedBlob is: ', recordedBlob);
}
render(){
return(
<div>
<ReactMic
record = {this.state.record}
className = "sound-wave"
onStop = {this.onStop}
onData = {this.onData}
strokeColor="#009900"
backgroundColor="#FF8990"/><br/>
<button onClick = {this.startRecording}>start</button>
<button onClick = {this.stopRecording}>stop</button>
<MusicPlayer playlist = {SongChallenge}/> </div>
)
}
Заранее спасибо.