Recherche avancée

Médias (10)

Mot : - Tags -/wav

Autres articles (58)

  • Contribute to documentation

    13 avril 2011

    Documentation is vital to the development of improved technical capabilities.
    MediaSPIP welcomes documentation by users as well as developers - including : critique of existing features and functions articles contributed by developers, administrators, content producers and editors screenshots to illustrate the above translations of existing documentation into other languages
    To contribute, register to the project users’ mailing (...)

  • Ajouter notes et légendes aux images

    7 février 2011, par

    Pour pouvoir ajouter notes et légendes aux images, la première étape est d’installer le plugin "Légendes".
    Une fois le plugin activé, vous pouvez le configurer dans l’espace de configuration afin de modifier les droits de création / modification et de suppression des notes. Par défaut seuls les administrateurs du site peuvent ajouter des notes aux images.
    Modification lors de l’ajout d’un média
    Lors de l’ajout d’un média de type "image" un nouveau bouton apparait au dessus de la prévisualisation (...)

  • Encoding and processing into web-friendly formats

    13 avril 2011, par

    MediaSPIP automatically converts uploaded files to internet-compatible formats.
    Video files are encoded in MP4, Ogv and WebM (supported by HTML5) and MP4 (supported by Flash).
    Audio files are encoded in MP3 and Ogg (supported by HTML5) and MP3 (supported by Flash).
    Where possible, text is analyzed in order to retrieve the data needed for search engine detection, and then exported as a series of image files.
    All uploaded files are stored online in their original format, so you can (...)

Sur d’autres sites (9519)

  • Audio to Video Conversion using FFmpeg in React

    6 octobre 2024, par Yuri

    Upon running my code, the audio successfully gets converted into a video and saved in the bucket, however, the video size is just 9 bytes.

    


    Here's my utility.

    


    import { FFmpeg } from '@ffmpeg/ffmpeg';
import { fetchFile } from '@ffmpeg/util';
import { ref, uploadBytes, getDownloadURL } from 'firebase/storage';
import { storage } from '../firebase'; 

export async function generateAndStoreVideo(audioPath, imagePath, userId) {
  try {
    const ffmpeg = new FFmpeg({ log: true });
    await ffmpeg.load();

    console.log('Fetching audio and image...');
    ffmpeg.writeFile( 'input.mp3', await fetchFile(audioPath));
    ffmpeg.writeFile('input.jpg', await fetchFile(imagePath));
    
    console.log('Running FFmpeg...');
    await ffmpeg.exec(['-i', 'sound.mp3', '-i', 'image.png', 'output.mp4']
    );

    console.log('FFmpeg completed!');
    
    const data = ffmpeg.readFile( 'output.mp4');
    const videoBlob = new Blob([data.buffer], { type: 'video/mp4' });

    console.log('Uploading video to Firebase...');
    const videoRef = ref(storage, `videos/${userId}/${Date.now()}_generated_video.mp4`);
    const uploadSnapshot = await uploadBytes(videoRef, videoBlob);

    const videoURL = await getDownloadURL(uploadSnapshot.ref);

    console.log('Video uploaded successfully! URL:', videoURL);

    return videoURL;
  } catch (error) {
    console.error('Error generating or uploading video:', error);
    throw new Error('Video generation or upload failed.');
  }
}



    


    After uploading, I also got this error :

    


    ErrnoError: FS error
    at handleError (http://localhost:3000/static/js/bundle.js:98427:58)
    at http://localhost:3000/static/js/bundle.js:98450:7


    


    I've made sure I'm using the new FFMPEG version and syntax, but the issues persist.

    


  • React Native (Android) : Download mp3 file

    21 février 2024, par Batuhan Fındık

    I get the youtube video link from the ui. I download the video from this link and convert it to mp3. I download it to my phone as mp3. The song opens on WhatsApp on the phone. but it doesn't open on the mp3 player. The song is not broken because it opens on WhatsApp too. Why do you think the mp3 player doesn't open ? Could it be from the file information ? I tried to enter some file information but it still won't open. For example, there is from information in songs played on an mp3 player. There is no from information in my song file. I tried to add it but it wasn't added.

    


    .net 8 api return :

    


        [HttpPost("ConvertVideoToMp3")]&#xA;public async Task<iactionresult> ConvertVideoToMp3(Mp3 data)&#xA;{&#xA;    try&#xA;    {&#xA;        string videoId = GetYoutubeVideoId(data.VideoUrl);&#xA;&#xA;        var streamInfoSet = await _youtubeClient.Videos.Streams.GetManifestAsync(videoId);&#xA;        var videoStreamInfo = streamInfoSet.GetAudioOnlyStreams().GetWithHighestBitrate();&#xA;&#xA;        if (videoStreamInfo != null)&#xA;        {&#xA;            var videoStream = await _youtubeClient.Videos.Streams.GetAsync(videoStreamInfo);&#xA;            var memoryStream = new MemoryStream();&#xA;&#xA;            await videoStream.CopyToAsync(memoryStream);&#xA;            memoryStream.Seek(0, SeekOrigin.Begin);&#xA;&#xA;            var videoFilePath = $"{videoId}.mp4";&#xA;            await System.IO.File.WriteAllBytesAsync(videoFilePath, memoryStream.ToArray());&#xA;&#xA;            var mp3FilePath = $"{videoId}.mp3";&#xA;            var ffmpegProcess = Process.Start(new ProcessStartInfo&#xA;            {&#xA;                FileName = "ffmpeg",&#xA;                Arguments = $"-i \"{videoFilePath}\" -vn -acodec libmp3lame -ab 128k -id3v2_version 3 -metadata artist=\"YourArtistName\" -metadata title=\"YourTitle\" -metadata from=\"youtube\" \"{mp3FilePath}\"",&#xA;                RedirectStandardError = true,&#xA;                UseShellExecute = false,&#xA;                CreateNoWindow = true&#xA;            });&#xA;&#xA;            await ffmpegProcess.WaitForExitAsync();&#xA;&#xA;            var file = TagLib.File.Create(mp3FilePath);&#xA;&#xA;   &#xA;            file.Tag.Artists = new string [] { "YourArtistName"};&#xA;            file.Tag.Title = "YourTitle";&#xA;            file.Tag.Album = "YourAlbumName"; &#xA;            file.Tag.Comment = "Source: youtube";&#xA;  &#xA;&#xA;            file.Save();&#xA;&#xA;            var mp3Bytes = await System.IO.File.ReadAllBytesAsync(mp3FilePath);&#xA;&#xA;            System.IO.File.Delete(videoFilePath);&#xA;            System.IO.File.Delete(mp3FilePath);&#xA;&#xA;            return File(mp3Bytes, "audio/mpeg", $"{videoId}.mp3");&#xA;        }&#xA;        else&#xA;        {&#xA;            return NotFound("Video stream not found");&#xA;        }&#xA;    }&#xA;    catch (Exception ex)&#xA;    {&#xA;        return StatusCode(500, $"An error occurred: {ex.Message}");&#xA;    }&#xA;}&#xA;</iactionresult>

    &#xA;

    React Native :

    &#xA;

         const handleConvertAndDownload = async () => {&#xA;    try {&#xA;      const url = &#x27;http://192.168.1.5:8080/api/Mp3/ConvertVideoToMp3&#x27;;&#xA;      const fileName = &#x27;example&#x27;;&#xA;      const newFileName = generateUniqueSongName(fileName);&#xA;      const filePath = RNFS.DownloadDirectoryPath &#x2B; &#x27;/&#x27;&#x2B;newFileName;&#xA;&#xA;      fetch(url, {&#xA;        method: &#x27;POST&#x27;,&#xA;        headers: {&#xA;          &#x27;Content-Type&#x27;: &#x27;application/json&#x27;,&#xA;        },&#xA;        body: JSON.stringify({videoUrl:videoUrl}),&#xA;      })&#xA;      .then((response) => {&#xA;        if (!response.ok) {&#xA;          Alert.alert(&#x27;Error&#x27;, &#x27;Network&#x27;);&#xA;          throw new Error(&#x27;Network response was not ok&#x27;);&#xA;        }&#xA;        return response.blob();&#xA;      })&#xA;      .then((blob) => {&#xA;        return new Promise((resolve, reject) => {&#xA;          const reader = new FileReader();&#xA;          reader.onloadend = () => {&#xA;            resolve(reader.result.split(&#x27;,&#x27;)[1]); &#xA;          };&#xA;          reader.onerror = reject;&#xA;          reader.readAsDataURL(blob);&#xA;        });&#xA;      })&#xA;      .then((base64Data) => {&#xA;        // Dosyanın varlığını kontrol et&#xA;        return RNFS.exists(filePath)&#xA;          .then((exists) => {&#xA;            if (exists) {&#xA;              console.log(&#x27;File already exists&#x27;);&#xA;              return RNFS.writeFile(filePath, base64Data, &#x27;base64&#x27;, &#x27;append&#x27;);&#xA;            } else {&#xA;              console.log(&#x27;File does not exist&#x27;);&#xA;              return RNFS.writeFile(filePath, base64Data, &#x27;base64&#x27;);&#xA;            }&#xA;          })&#xA;          .catch((error) => {&#xA;            console.error(&#x27;Error checking file existence:&#x27;, error);&#xA;            throw error;&#xA;          });&#xA;      })&#xA;      .then(() => {&#xA;        Alert.alert(&#x27;Success&#x27;, &#x27;MP3 file downloaded successfully.&#x27;);&#xA;        console.log(&#x27;File downloaded successfully!&#x27;);&#xA;      })&#xA;      .catch((error) => {&#xA;        Alert.alert(&#x27;Error&#x27;, error.message);&#xA;        console.error(&#x27;Error downloading file:&#x27;, error);&#xA;      });&#xA;    } catch (error) {&#xA;      Alert.alert(&#x27;Error&#x27;, error.message);&#xA;      console.error(error);&#xA;    }&#xA;  };&#xA;

    &#xA;

  • How to Correctly Implement ffmpeg Complex Filters in Node.js for Image Processing ?

    24 janvier 2024, par Luke

    Problem :

    &#xA;

    I am trying to add filters and transitions between my image slideshow array, and am struggling to apply the proper filters. For example, I get errors like this :

    &#xA;

    {&#xA;  "errorType": "Error",&#xA;  "errorMessage": "ffmpeg exited with code 234: Failed to set value &#x27;fade=type=in:start_time=0:duration=1,zoompan=z=zoom&#x2B;0.002:d=120:x=if(gte(zoom,1.2),x,x&#x2B;1):y=if(gte(zoom,1.2),y,y&#x2B;1)&#x27; for option &#x27;filter_complex&#x27;: Invalid argument\nError parsing global options: Invalid argument\n",&#xA;  "trace": [&#xA;    "Error: ffmpeg exited with code 234: Failed to set value &#x27;fade=type=in:start_time=0:duration=1,zoompan=z=zoom&#x2B;0.002:d=120:x=if(gte(zoom,1.2),x,x&#x2B;1):y=if(gte(zoom,1.2),y,y&#x2B;1)&#x27; for option &#x27;filter_complex&#x27;: Invalid argument",&#xA;    "Error parsing global options: Invalid argument",&#xA;    "",&#xA;    "    at ChildProcess.<anonymous> (/opt/nodejs/node_modules/fluent-ffmpeg/lib/processor.js:182:22)",&#xA;    "    at ChildProcess.emit (node:events:517:28)",&#xA;    "    at ChildProcess._handle.onexit (node:internal/child_process:292:12)"&#xA;  ]&#xA;}&#xA;</anonymous>

    &#xA;

    Lambda Function Code :

    &#xA;

     async function concat(bucketName, imageKeys) {&#xA;      const imageStreams = await Promise.all(&#xA;        imageKeys.map(async (key, i) => {&#xA;          const command = new GetObjectCommand({ Bucket: bucketName, Key: key });&#xA;          const response = await s3.send(command);&#xA;          // Define the temporary file path based on the index&#xA;          const tempFilePath = `/tmp/${i}.png`;&#xA;    &#xA;          // Write the image data to the temporary file&#xA;          await fs.writeFile(tempFilePath, response.Body);&#xA;    &#xA;          // Return the file path to be used later&#xA;          return tempFilePath;&#xA;        })&#xA;      );&#xA;    &#xA;      // Create a file list content with durations&#xA;      let fileContent = "";&#xA;      for (let i = 0; i &lt; imageStreams.length; i&#x2B;&#x2B;) {&#xA;        fileContent &#x2B;= `file &#x27;${imageStreams[i]}&#x27;\nduration 1\n`;&#xA;    &#xA;        // Check if it&#x27;s the last image, and if so, add it again&#xA;        if (i === imageStreams.length - 1) {&#xA;          fileContent &#x2B;= `file &#x27;${imageStreams[i]}&#x27;\nduration 1\n`;&#xA;        }&#xA;      }&#xA;    &#xA;      // Define the file path for the file list&#xA;      const fileListPath = "/tmp/file_list.txt";&#xA;    &#xA;      // Write the file list content to the file&#xA;      await fs.writeFile(fileListPath, fileContent);&#xA;    &#xA;      try {&#xA;        await fs.writeFile(fileListPath, fileContent);&#xA;      } catch (error) {&#xA;        console.error("Error writing file list:", error);&#xA;        throw error;&#xA;      }&#xA;    &#xA;      // Create a complex filter to add zooms and pans&#xA;      // Simplified filter example&#xA;  let complexFilter = [&#xA;    // Example of a fade transition&#xA;    {&#xA;      filter: &#x27;fade&#x27;,&#xA;      options: { type: &#x27;in&#x27;, start_time: 0, duration: 1 },&#xA;      inputs: &#x27;0:v&#x27;, // first video stream&#xA;      outputs: &#x27;fade0&#x27;&#xA;    },&#xA;    // Example of dynamic zoompan&#xA;    {&#xA;      filter: &#x27;zoompan&#x27;,&#xA;      options: {&#xA;        z: &#x27;zoom&#x2B;0.002&#x27;,&#xA;        d: 120, // duration for this image&#xA;        x: &#x27;if(gte(zoom,1.2),x,x&#x2B;1)&#x27;, // dynamic x position&#xA;        y: &#x27;if(gte(zoom,1.2),y,y&#x2B;1)&#x27; // dynamic y position&#xA;      },&#xA;      inputs: &#x27;fade0&#x27;,&#xA;      outputs: &#x27;zoom0&#x27;&#xA;    }&#xA;    // Continue adding filters for each image&#xA;  ];&#xA;&#xA;  let filterString = complexFilter&#xA;    .map(&#xA;      (f) =>&#xA;        `${f.filter}=${Object.entries(f.options)&#xA;          .map(([key, value]) => `${key}=${value}`)&#xA;          .join(":")}`&#xA;    )&#xA;    .join(",");&#xA;    &#xA;      let filterString = complexFilter&#xA;        .map(&#xA;          (f) =>&#xA;            `${f.filter}=${Object.entries(f.options)&#xA;              .map(([key, value]) => `${key}=${value}`)&#xA;              .join(":")}`&#xA;        )&#xA;        .join(",");&#xA;    &#xA;      console.log("Filter String:", filterString);&#xA;    &#xA;      return new Promise((resolve, reject) => {&#xA;        ffmpeg()&#xA;          .input(fileListPath)&#xA;          .complexFilter(filterString)&#xA;          .inputOptions(["-f concat", "-safe 0"])&#xA;          .outputOptions("-c copy")&#xA;          .outputOptions("-c:v libx264")&#xA;          .outputOptions("-pix_fmt yuv420p")&#xA;          .outputOptions("-r 30")&#xA;          .on("end", () => {&#xA;            resolve();&#xA;          })&#xA;          .on("error", (err) => {&#xA;            console.error("Error during video concatenation:", err);&#xA;            reject(err);&#xA;          })&#xA;          .saveToFile("/tmp/output.mp4");&#xA;      });&#xA;    }&#xA;

    &#xA;

    Filter String Console Log :

    &#xA;

    Filter String: fade=type=in:start_time=0:duration=1,zoompan=z=zoom&#x2B;0.002:d=120:x=if(gte(zoom,1.2),x,x&#x2B;1):y=if(gte(zoom,1.2),y,y&#x2B;1)&#xA;

    &#xA;

    Questions :

    &#xA;

      &#xA;
    1. What is the correct syntax for implementing complex filters like zoompan and fade in ffmpeg when used in a Node.js environment ?
    2. &#xA;

    3. How do I ensure the filters are applied correctly to each image in the sequence ?
    4. &#xA;

    5. Is there a better way to dynamically generate these filters based on the number of images or their content ?
    6. &#xA;

    &#xA;

    Any insights or examples of correctly implementing this would be greatly appreciated !

    &#xA;