Я могу создавать фрагменты данных, записанные с помощью MediaRecorder API. Храните их и воспроизводите с помощью MediaSource API. Это нормально работает, если я добавляю все фрагменты в правильном порядке в sourceBuffer.
async function recordScreen() {
recordedChunks = []
stream = await navigator.mediaDevices.getDisplayMedia(getDisplayMediaOptions)
mediaRecorder = new MediaRecorder(stream)
mediaRecorder.ondataavailable = event => {
if (event.data.size > 0) {
recordedChunks.push(event.data)
}
}
const interval = setInterval(() => {
if (isRecording) {
mediaRecorder.requestData()
} else {
clearInterval(interval)
}
}, 1000)
mediaRecorder.start()
isRecording = true
}
function replay(chunks) {
const mediaSource = new MediaSource()
video.src = URL.createObjectURL(mediaSource)
mediaSource.addEventListener('sourceopen', () => {
const sourceBuffer = mediaSource.addSourceBuffer()
const appendChunk = chunk => chunk.arrayBuffer().then(data => sourceBuffer.appendBuffer(data))
sourceBuffer.addEventListener('updateend', () => {
if (chunks[i]) {
appendChunk(chunks[i++])
} else {
mediaSource.endOfStream()
}
})
appendChunk(chunks[i++])
})
}
Однако проблемы начинаются, когда я пытаюсь не добавлять все куски.
- Как я могу пропустить начало записанного видео?
- Если фрагмент отсутствует, возможно ли, что видео будет пустым на секунду, пока не появится новый фрагмент?
Я знаю, что записанный носитель содержит не только необработанные видеоданные, но и какую-то информацию заголовка. Но на данный момент у меня нет плана, что я делаю. Может, вы мне поможете:
- Как я могу проверить эту информацию заголовка (не видеоданные)?
- Могу я их отредактировать или добавить? Есть ли какие-нибудь хорошие ресурсы о том, как это сделать?
Моя цель - просто захватить любой из записанных фрагментов и затем воспроизвести в нем видеоданные. И если какой-то кусок отсутствует, он должен просто продолжить воспроизведение следующих фрагментов.
Задний план
Я пытаюсь разработать решение для потоковой передачи в реальном времени, которое работает p2p с webRTC. Я знаю, что могу поместить поток прямо в RtcConnection. Но насколько мне известно, это означает, что каждый одноранговый узел может передавать другому узлу только 1 полный поток. Было бы неплохо, если бы каждый партнер был более гибким в участии в прямом эфире, например. совместное использование 1.5 потоков. Поэтому я подумал, что имеет смысл поделиться этими данными через RtcDataChannels, собрать их и воспроизвести через MediaSource API. Если у вас есть другие идеи, как это сделать, я был бы очень признателен.
