ffmpegwasm / ffmpegwasm/ffmpeg.wasm

The video is not loading and not merging

Abierto
#564 2 comentarios 1 reacción 0 asignados Ver en GitHub
Lenguaje dominante
C
Estrellas
17.8k
Forks
1.1k
Métricas de merge de PR
Sin PR fusionados en 30 d

Descripción

**Describe the bug**
The video is not loading and not merging, I'm trying to merge audio to a video using ffmpeg Can anyone please help me to do that using this package? uinsg react + vite

**To Reproduce**
npm run dev
```

import { useState, useRef } from "react";
import { FFmpeg } from "@ffmpeg/ffmpeg";
import { toBlobURL, fetchFile } from "@ffmpeg/util";

function App() {
const [loaded, setLoaded] = useState(false);
const ffmpegRef = useRef(new FFmpeg());
const videoRef = useRef(null);
const messageRef = useRef(null);

const load = async () => {
const baseURL = "https://unpkg.com/@ffmpeg/core-mt@0.12.2/dist/esm";
const ffmpeg = ffmpegRef.current;
ffmpeg.on("log", ({ message }) => {
if (messageRef.current) messageRef.current.innerHTML = message;
});
// Load FFmpeg
await ffmpeg.load({
coreURL: await toBlobURL(`${baseURL}/ffmpeg-core.js`, "text/javascript"),
wasmURL: await toBlobURL(
`${baseURL}/ffmpeg-core.wasm`,
"application/wasm"
),
workerURL: await toBlobURL(
`${baseURL}/ffmpeg-core.worker.js`,
"text/javascript"
),
});
setLoaded(true);
};

const transcode = async () => {
const videoURL1 = "https://storage.googleapis.com/gtv-videos-bucket/sample/BigBuckBunny.mp4"; // Replace with your video URLs
const videoURL2 = "https://storage.googleapis.com/gtv-videos-bucket/sample/BigBuckBunny.mp4"; // Replace with your video URLs
const ffmpeg = ffmpegRef.current;

// Write the input videos to temporary files
await ffmpeg.writeFile("input1.webm", await fetchFile(videoURL1));
await ffmpeg.writeFile("input2.webm", await fetchFile(videoURL2));

// Interlace (blend) the two videos using the filter_complex option
await ffmpeg.exec([
"-i", "input1.webm",
"-i", "input2.webm",
"-filter_complex",
"[0:v][1:v]blend=all_expr='A*(if(eq(0,N/2),1,T))+B*(if(eq(0,N/2),T,1))'",
"output.mp4",
]);

// Read the resulting MP4 file and display it
const fileData = await ffmpeg.readFile('output.mp4');
const data = new Uint8Array(fileData as ArrayBuffer);
if (videoRef.current) {
videoRef.current.src = URL.createObjectURL(
new Blob([data.buffer], { type: 'video/mp4' })
)
}
};

return loaded ? (
<>



Interlace and Save as MP4



) : (
Load ffmpeg-core
);
}

export default App;

```
**Expected behavior**
It should merge the audio with the video

**Desktop (please complete the following information):**
- OS: macOS
- Browser chrome
- Version 116.0.5845.110

Guía de contribución

Abrir la guía de contribución

Evaluación

Este issue todavía no se ha evaluado.

Recibe los nuevos issues en tu correo

Un resumen breve de issues de GitHub para principiantes.