Estoy usando seekToNextFrame que es algo experimental de Mozilla: https://developer.mozilla.org/en-US/docs/Web/API/HTMLMediaElement/seekToNextFrame
Estoy usando esto para repasar todos los cuadros, a veces, cerca de los últimos cuadros del video aparece un error:
No capturado (en promesa) DOMException: se intentó usar un objeto que no es, o ya no es, usable
const video_src = "600_frames_in_120fps.mp4"; let canvas, ctx, video; async function process_frame(e) { const video = e.target; const bitmap = await createImageBitmap(video); ctx.drawImage(bitmap, 0, 0, canvas.width, canvas.height); if (!video.ended) { video.seekToNextFrame(); } } async function init() { if (!HTMLMediaElement.prototype.seekToNextFrame) { // TODO display error in body console.log( `[ERROR] HTMLMediaElement seekToNextFrame not supported; are you using firefox?`); return; } canvas = document.createElement('canvas'); document.body.append(canvas); ctx = canvas.getContext("2d"); video = document.createElement('video'); video.src = video_src; video.volume = 0; // required for play() to work document.body.append(video); video.addEventListener("seeked", process_frame); await video.play(); video.currentTime = 0; // trigger seeked } init(); console.log no dio ningún undefined .
A mi me huele a bicho parecido a:
InvalidStateError: se intentó usar un objeto que no se puede usar o ya no se puede usar
Pero podría estar equivocado.