Currently, I am trying to manipulate a HLS audio feed that is set as the source for an audio player element. My goal is to record this incoming stream for future use. Despite using the MediaRecorder package to capture the stream from the audio player source, I have encountered a roadblock where the media recorder indicates that the source is not of type 'MediaStream'.
Here is the code snippet for initializing the stream to be played in the audio element:
initStream() {
// get the audio player
let audioEl = this.audioPlayer.nativeElement;
// create the HLS object
this.hls = new Hls();
// stream source URL
var source = "https://as-hls-uk-live.akamaized.net/pool_904/live/uk/bbc_radio_one/bbc_radio_one.isml/bbc_radio_one-audio%3d128000.norewind.m3u8";
// assign the source to the HLS object
this.hls.loadSource(source);
//attach the HLS to the audio player
this.hls.attachMedia(audioEl);
console.log(`Created audioPlayer${this.playerId}`);
}
This is followed by the code for initializing the stream recording:
initRecording(){
this.recorder = null;
this.recordedChunks = [];
try {
this.recorder = new MediaRecorder(this.hls, {mimeType: "audio/ogg"});
} catch (e) {
console.error('Exception while creating MediaRecorder: ' + e);
return;
}
this.recorder.ondataavailable = (event) => {
console.log(' Recorded chunk of size ' + event.data.size + "B");
this.recordedChunks.push(event.data);
};
this.recorder.start();
}
Unfortunately, when attempting to initialize the recording, I receive the following error message:
Exception while creating MediaRecorder: TypeError: Failed to construct 'MediaRecorder': parameter 1 is not of type 'MediaStream'I also attempted to use the audio player source as the stream input for the media recorder. However, in this scenario, the media recorder fails to start recording due to no tracks being listed in the source.
initRecording(){
let audioEl = this.audioPlayer.nativeElement;
var audioStream = audioEl.src;
this.recorder = null;
this.recordedChunks = [];
try {
this.recorder = new MediaRecorder(audioStream, {mimeType: "audio/ogg"});
} catch (e) {
console.error('Exception while creating MediaRecorder: ' + e);
return;
}
this.recorder.ondataavailable = (event) => {
console.log(' Recorded chunk of size ' + event.data.size + "B");
this.recordedChunks.push(event.data);
};
this.recorder.start();
}