Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

190
Vistas
Problemas al pasar canvas.toDataURL() a ffmpeg.wasm

Estoy tratando de configurar la conversión de animación de lienzo a video con FFMPEG.wasm. La idea es generar un montón de imágenes con canvas.toDataURL() y luego enviarlas a un servidor Node para generar un video. Todo funciona perfectamente con las imágenes precargadas que extraigo del directorio público para realizar pruebas; sin embargo, cuando intento enviar un montón (o una sola) de imágenes creadas con canvas.toDataURL() el siguiente error:

 RuntimeError: abort(Error: ENAMETOOLONG: name too long, open 'data:image/png;base64, ...

Traté de reemplazar canvas.toDataURL() con canvas.getContext('2d').getImageData() , sin embargo, esto tampoco ayudó. A continuación se muestra un código de corte que estoy usando:

frente:

 async function fetchData() { const response = await fetch('/api/record-canvas', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ image: here_goes_the_canvas_data }), }); }

back-end:

 await ffmpeg.load(); ffmpeg.FS('writeFile', `001.png`, await fetchFile(image)); await ffmpeg.run('-loop', '1', '-i', '001.png', '-c:v', 'libx264', '-t', '30', '-pix_fmt', 'yuv420p', 'out.mp4'); await fs.promises.writeFile('out.mp4', ffmpeg.FS('readFile', 'out.mp4'));

El código anterior está simplificado para hacer un video de una sola imagen repitiéndola durante 30 segundos. Una vez más, funciona muy bien con la imagen precargada, pero no con los datos del lienzo.

about 4 years ago · Juan Pablo Isaza
1 Respuestas
Responde la pregunta

0

Para aquellos que se encontraron con el mismo problema, esta es la solución que se me ocurrió:

  1. dataURL debe ser jpeg (por ejemplo, canvas.toDataURL('image/jpeg') ).

  2. Debe transformarlo en un valor de búfer (por ejemplo Buffer.from(image.split(',')[1], 'base64') antes de pasar a la función fetchFile de FFMPEG.

  3. Las respuestas son largas y difíciles de entender.

about 4 years ago · Juan Pablo Isaza Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda