Vi el ejemplo de uso de MediaRecorder en Internet. No esperaba encontrar un error cuando lo usé. Le recordé amablemente al autor y le agradecí por compartir el código fuente.
Dirección de ejemplo: https://wendychengc.github.io/media-recorder-video-canvas/cameracanvas.html ,
Dirección de código abierto: https://wendychengc.github.io/media-recorder-video-canvas/cameracanvas.html
Este ejemplo tiene errores:
fenómeno de error: a excepción del archivo descargado después de la primera grabación, cada archivo descargado es el primer contenido grabado
. Al abrir con windowsMediaPlay player y con win10 movie and TV player, la barra de progreso falla Pull, excepto por el primer archivo de video grabado después de la descarga automática, otros archivos de video han estado reproduciendo el contenido de video descargado después de la primera grabación, en lugar de
usar el reproductor PotPlayer, la reproducción predeterminada también es el primer video descargado Contenido, pero cuando se arrastra la barra de desplazamiento hasta el final para reproducirla, la reproducción es en realidad el contenido de video grabado. No puedo entender este reproductor, aunque eliminé todos los demás videos grabados, reproduce el mismo video En realidad hay dos efectos de video.
Motivo del error: la matriz de blobs almacenados antes de cada grabación no se borra, y el método de descarga después de la grabación usa la matriz de allChunks, porque la segunda grabación no se borra, por lo que en realidad se guarda la primera vez Y la matriz total de blobs dos y dos veces, lógicamente el video siempre reproducirá el primer + segundo contenido descargado, pero de hecho el video siempre reproducirá el primer contenido, la razón es que aunque la segunda grabación La matriz de allChunks no se borra, pero se registra el número total de blobs grabados durante la segunda grabación (vista a través de console.log (allChunks)), aunque se reproduce el contenido del primer + segundo video grabado, pero El número de blobs reproducidos es el número de la segunda grabación, por lo que cuando el segundo tiempo de grabación es mucho más largo que el primero (el número de blobs es más que la primera vez), puede ver la segunda vez en el medio de la reproducción Si el tiempo de grabación es el mismo (el número de blobs es el mismo), el contenido reproducido es la primera vez.
Corrección de errores: borre la matriz allChunks antes de cada grabación allChunks.length = 0 ;, no se recomienda allChunks = []; esta forma de escritura.
1 // Comience a grabar 2 startBtn.onclick = function (e) { 3 allChunks.length = 0; // Se utiliza para resolver el error del ejemplo: excepto el archivo descargado después de la primera grabación, se reproduce cada archivo descargado Primer contenido grabado 4 recorder.start (10); / 5 startBtn.disabled = true ; 6 pauseBtn.disabled = false ; 7 resumeBtn.disabled = true ; 8 stopBtn.disabled = false ; 9 };