I have got a Vue.js project and I need to record voice in that. I have written some code and it works in that users can listen to their recorded voice, but I have got a problem: I would like to allow users to download their voice but when they click on the download they receive a .txt encoded file.
These are my functions for starting and stopping recording:
startRecord(){
navigator.mediaDevices.getUserMedia({ audio: true })
.then(stream => {
this.mediaRecorder = new MediaRecorder(stream);
this.mediaRecorder.start(1000);
const self = this
this.mediaRecorder.ondataavailable = function(event:any) {
self.audioChunks.push(event.data);
}
});
}
stopRecord(){
const self = this
this.mediaRecorder.stop();
this.mediaRecorder.addEventListener("stop", () => {
const audioBlob = new Blob(self.audioChunks);
self.recordedVoice = URL.createObjectURL(audioBlob)
});
}
and I pass self.recordVoice
to the audio component like this:
<audio controls class="" >
<source :src="recordedVoice" type="audio/mpeg">
</audio>