Media Recorder API Video Chunk. ⇐ Javascript

[Anonymous]

У меня есть приложение Vue JS2, которое использует API MediareCorder для создания Blob для видео. Пользователь может сделать паузу видео, и на паузе пользователь может удалить последний записанный кусок. и записать видео еще раз.videoInit() {
const options = {
mimeType: this.getMimeType(),
videoBitsPerSecond: 5 * 1024 * 1024,
}
this.recordedChunks = [];
this.mediaRecorder = new MediaRecorder(this.stream, options);

let self = this;
this.mediaRecorder.addEventListener('dataavailable', function (e) {
if (e.data.size > 0) {
self.currentSessionChunks.push(e.data);
}
});
}

startRecordVideo(slowModeFactor = false) {
if (this.mediaRecorder) {
this.currentSessionChunks = [];
this.currentSlowModeFactor = slowModeFactor ? 0.25 : 1;
this.mediaRecorder.start(100);
}
}

resumeRecordVideo(slowModeFactor = false) {
if (this.mediaRecorder && this.mediaRecorder.state === 'paused') {
this.currentSlowModeFactor = slowModeFactor ? 0.25 : 1;
this.currentSessionChunks = [];
this.mediaRecorder.resume();
}
}

stopRecordVideo(callback) {
if (!this.mediaRecorder) {
return
}
let self = this;
this.mediaRecorder.addEventListener('stop', function () {
if (self.currentSessionChunks.length > 0) {
self.recordedSessions.push({
chunks: [...self.currentSessionChunks],
slowModeFactor: this.currentSlowModeFactor
});
}

const allChunks = self.recordedSessions.flatMap(session => session.chunks);
console.log(allChunks);
callback(new Blob(allChunks, {type: self.getMimeType()}))
});
this.mediaRecorder.stop()
}

pauseRecordVideo() {
if (this.mediaRecorder && this.mediaRecorder.state === 'recording') {
if (this.currentSessionChunks.length > 0) {
console.log(this.currentSessionChunks);
const endTime = performance.now();
const durationMs = endTime - this.currentSessionStartTime;
const actualDuration = durationMs / 1000;
const adjustedDuration = actualDuration / this.currentSlowModeFactor;

this.recordedSessions.push({
chunks: [...this.currentSessionChunks],
slowModeFactor: this.currentSlowModeFactor,
actualDuration,
adjustedDuration
});

this.currentSessionChunks = [];
}
this.mediaRecorder.pause();
}
}

deleteLastSession() {
if (this.recordedSessions.length > 0) {
const lastSession = this.recordedSessions.pop();
const lastSessionAdjustedDuration = lastSession.adjustedDuration || 0;
const lastSessionActualDuration = lastSession.actualDuration;
const recordedSessionsLength = this.recordedSessions.length;
const isSlowMode = lastSession.slowModeFactor !== 1;

return { lastSessionAdjustedDuration, lastSessionActualDuration, recordedSessionsLength, isSlowMode };
}

return { lastSessionAdjustedDuration: 0, lastSessionActualDuration: 0, recordedSessionsLength: 0, isSlowMode: false };
}
< /code>
У меня есть функция медленного режима, но в настоящее время проблема выпускается только на проблему в обычном режиме видео. Возобновите его и запишите в течение 5 секунд и сделайте паузу. Затем удалил этот последний кусок. Записано снова на 3 секунды, а затем остановите запись. Созданное видео Blob составляет 11 секунд, в то время как оно должно быть всего 6 секунд. Если я записываю, возобновлю и удаляю и остановлюсь, тогда без проблем, но если я снова записываю после удаления чанка, это проблема
, пожалуйста, предложите здесь, что вызывает проблему.>

Подробнее здесь: https://stackoverflow.com/questions/795 ... hunk-issue