Recherche avancée

Sur d’autres sites (8133)

• How do I merge images and an audio file into a single video ?

  3 janvier 2024, par Anil

  I am creating a web application using next js.
I want to create a video by combining three images and an audio track in such a way that each image is displayed for an equal duration that collectively matches the length of the audio. It will all happen locally on the browser.

  


  This is my code for converting images and audio into a video.

  


  import {FFmpeg} from '@ffmpeg/ffmpeg';
import { fetchFile, toBlobURL } from '@ffmpeg/util';


export async function createVideo(ImageFiles, audioFile) {

  try {
    const baseURL = 'https://unpkg.com/@ffmpeg/core@0.12.4/dist/umd';
    const ffmpeg = new FFmpeg({ log: true});

    console.log('Loading ffmpeg core');
    await ffmpeg.load({
      corePath: await toBlobURL(`${baseURL}/ffmpeg-core.js`, 'text/javascript'),
      wasmPath: await toBlobURL(`${baseURL}/ffmpeg-core.wasm`, 'application/wasm'),
    });
    await ffmpeg.load();
    console.log('Finished loading ffmpeg core');

    for (let i = 0; i < ImageFiles.length; i++) {
      ffmpeg.writeFile(
        `image${i+1}.jpg`,
        await fetchFile(ImageFiles[i].imageUrl)
      );
    }

    ffmpeg.FS('writeFile', 'audio.mp3', await fetchFile(audioFile));


    const durationPerImage = (await getAudioDuration(ffmpeg, 'audio.mp3')) / ImageFiles.length;
    let filterComplex = '';
    for (let i = 0; i < ImageFiles.length - 1; i++) {filterComplex += `[${i}:v]trim=duration=${durationPerImage},setpts=PTS-STARTPTS[v${i}]; `;
    }
    filterComplex += `${ImageFiles.slice(0, -1).map((_, i) => `[v${i}]`).join('')}concat=n=${ImageFiles.length - 1}:v=1:a=0,format=yuv420p[v];`;

    await ffmpeg.run(
      '-framerate', '1', '-loop', '1', '-t', durationPerImage, '-i', 'image%d.jpg', '-i', 'audio.mp3',
      '-filter_complex', filterComplex, '-map', '[v]', '-map', '1:a',
      '-c:v', 'libx264', '-tune', 'stillimage', '-c:a', 'aac', '-b:a', '192k', 'output.mp4'
    );

    const data = ffmpeg.FS('readFile', 'output.mp4');

    const videoURL = URL.createObjectURL(new Blob([data.buffer], { type: 'video/mp4' }));
    return videoURL;
  } catch (error) {
    console.error('Error creating video:', error);
    throw new Error('Failed to create video');
  }
}

async function getAudioDuration(ffmpeg, audioFilename) {
  await ffmpeg.run('-i', audioFilename, '-show_entries', 'format=duration', '-of', 'default=noprint_wrappers=1:nokey=1', 'duration.txt');
  const data = ffmpeg.FS('readFile', 'duration.txt');
  const durationString = new TextDecoder().decode(data);
  const duration = Math.floor(parseFloat(durationString.trim())); 
  return duration;
}


  


  I am getting this error :

  


  CreateVideo.js:65  Error creating video: RuntimeError: Aborted(LinkError: WebAssembly.instantiate(): Import #70 module="a" function="qa": function import requires a callable). Build with -sASSERTIONS for more info.


  


  Can someone help me with this ?

  


• Black detect ffmpeg and use in a javascript

  6 février 2023, par sol

  I had an ffmpeg script that allow me to detect black frames from a video file sample from the bottom.

  


  and i want to create a javascript code that will allow me to do the same function sample from the bottom but its not working.

  


  original code from ffmpeg script :

  


  `ffmpeg -i LKE-BLACK.mp4 -vf "blackdetect=d=0.5:pix_th=0.10" -an -f null - 2>&1 | findstr blackdetect > output.txt

  


  node script :

  


  var fs = require('fs');
const ffmpeg = require("ffmpeg.js");

var createStream = fs.createWriteStream("data.txt");
createStream.end();

const transcode = async ({ target: { files }  }) => {
    message.innerHTML = 'Loading ffmpeg-core.js';
    await ffmpeg.load();
    message.innerHTML = 'Start transcoding';
    
    await ffmpeg.transcode('-i', 'LKE-BLACK.mp4', "-vf", "blackdetect=d=0.5:pix_th=0.10", '-an', '-f', 'null - 2>&1', );
    message.innerHTML = 'Complete transcoding';

    fs.writeFile("data.txt", function (err) {
        if (err) throw err;
        console.log('File is created successfully.');
      });
}


  


• Fluent-ffmpeg Invalid data found when processing input error only when the second request is received

  31 décembre 2022, par koji tanaka

  I am using Node.js for backend to use ffmpeg. To use ffmpeg, I adopted fluent-ffmpeg. This is working perfectly except for one problem. That is when I send video from client side SPA(single page application) to the server-side for the "second" time, node application crashes.

  


  What I did is saving the received video in the backend folder, which is made in the process, and taking a snapshot of the video.
This code actually works everytime after restarting the server, but once I used this route and try another time, the error message "Invalid data found when processing input video ./received/${receivedName}" comes up.

  


  app.post("/convert", fileUpload({ createParentPath: true }), async function (req, res) {
    makeDir(receivedVideoDirectory);
    const receivedName = Object.keys(req.files)[0];
    const directoryName = receivedName.substring(0, receivedName.indexOf("."));

    const receivedFile = req.files[receivedName];
    transcodedSegFolder = `./public/transcoded/${dirName}`;
    console.log("transcoded segment file folder is here", transcodedSegFolder);
    makeDir(transcodedSegFolder);

    fs.open(`./received/${receivedName}`, 'w', (err, fd) => {
        if (err) throw err;
        fs.writeFile(fd, receivedFile["data"], function (err) {
            if (err) {
                return console.log("Err in write file ", err);
            }
            console.log("The file was saved!", receivedName);
            fs.close(fd, (err) => {
                if (err) throw err;
            });
        });
    });

    ffmpeg(`./received/${receivedName}`)
        .takeScreenshots(
            {
                count: 1,
                timemarks: ['00:00:01.000'],
                folder: './public/thumbnails',
                filename: dirName
            }).on('error', function(err) {
                console.log('screenshot error happened: ' + err.message);
              }).on('end', function(err) {
                console.log('Screenshot process finished: ');
              });


  


  Probably some program keeps working, but I cannot find it. Any help is appreciated. Thank you.