Recherche avancée
Autres articles (59)
-
Mise à jour de la version 0.1 vers 0.2
24 juin 2013, parExplications des différents changements notables lors du passage de la version 0.1 de MediaSPIP à la version 0.3. Quelles sont les nouveautés
Au niveau des dépendances logicielles Utilisation des dernières versions de FFMpeg (>= v1.2.1) ; Installation des dépendances pour Smush ; Installation de MediaInfo et FFprobe pour la récupération des métadonnées ; On n’utilise plus ffmpeg2theora ; On n’installe plus flvtool2 au profit de flvtool++ ; On n’installe plus ffmpeg-php qui n’est plus maintenu au (...) -
Configurer la prise en compte des langues
15 novembre 2010, parAccéder à la configuration et ajouter des langues prises en compte
Afin de configurer la prise en compte de nouvelles langues, il est nécessaire de se rendre dans la partie "Administrer" du site.
De là, dans le menu de navigation, vous pouvez accéder à une partie "Gestion des langues" permettant d’activer la prise en compte de nouvelles langues.
Chaque nouvelle langue ajoutée reste désactivable tant qu’aucun objet n’est créé dans cette langue. Dans ce cas, elle devient grisée dans la configuration et (...) -
Websites made with MediaSPIP
2 mai 2011, parThis page lists some websites based on MediaSPIP.
Sur d’autres sites (8462)
-
Socket.io client in js and server in Socket.io go doesn't send connected messege and data
24 mars 2023, par OmriHalifaI am using
ffmpegandsocket.ioand I have some issues. I'm trying to send a connection request to a server written in Go through React, but I'm unable to connect to it. I tried adding the events in useEffect and it's still not working, what should I do ? i attaching my code in js and in go :
main.go

package main

import (
 "log"

 "github.com/gin-gonic/gin"

 socketio "github.com/googollee/go-socket.io"
)

func main() {
 router := gin.New()

 server := socketio.NewServer(nil)

 server.OnConnect("/", func(s socketio.Conn) error {
 s.SetContext("")
 log.Println("connected:", s.ID())
 return nil
 })

 server.OnEvent("/", "notice", func(s socketio.Conn, msg string) {
 log.Println("notice:", msg)
 s.Emit("reply", "have "+msg)
 })

 server.OnEvent("/", "transcoded-video", func(s socketio.Conn, data string) {
 log.Println("transcoded-video:", data)
 })

 server.OnEvent("/", "bye", func(s socketio.Conn) string {
 last := s.Context().(string)
 s.Emit("bye", last)
 s.Close()
 return last
 })

 server.OnError("/", func(s socketio.Conn, e error) {
 log.Println("meet error:", e)
 })

 server.OnDisconnect("/", func(s socketio.Conn, reason string) {
 log.Println("closed", reason)
 })

 go func() {
 if err := server.Serve(); err != nil {
 log.Fatalf("socketio listen error: %s\n", err)
 }
 }()
 defer server.Close()

 if err := router.Run(":8000"); err != nil {
 log.Fatal("failed run app: ", err)
 }
}



App.js

import './App.css';
import { useEffect } from 'react';
import { createFFmpeg, fetchFile } from '@ffmpeg/ffmpeg';
import { io } from 'socket.io-client'; 

function App() {
 const socket = io("http://localhost:8000",function() {
 // Send a message to the server when the client is connected
 socket.emit('clientConnected', 'Client has connected to the server!');
 })

 const ffmpegWorker = createFFmpeg({
 log: true
 })

 // Initialize FFmpeg when the component is mounted
 async function initFFmpeg() {
 await ffmpegWorker.load();
 }

 async function transcode(webcamData) {
 const name = 'record.webm';
 await ffmpegWorker.FS('writeFile', name, await fetchFile(webcamData));
 await ffmpegWorker.run('-i', name, '-preset', 'ultrafast', '-threads', '4', 'output.mp4');
 const data = ffmpegWorker.FS('readFile', 'output.mp4');
 
 // Set the source of the output video element to the transcoded video data
 const video = document.getElementById('output-video');
 video.src = URL.createObjectURL(new Blob([data.buffer], { type: 'video/mp4' }));
 
 // Remove the output.mp4 file from the FFmpeg virtual file system
 ffmpegWorker.FS('unlink', 'output.mp4');
 
 // Emit a "transcoded-video" event to the server with the transcoded video data
 socket.emit("transcoded-video", data.buffer)
 }
 
 

 let mediaRecorder;
 let chunks = [];
 
 // Request access to the user's camera and microphone and start recording
 function requestMedia() {
 const webcam = document.getElementById('webcam');
 navigator.mediaDevices.getUserMedia({ video: true, audio: true })
 .then(async (stream) => {
 webcam.srcObject = stream;
 await webcam.play();

 // Set up a MediaRecorder instance to record the video and audio
 mediaRecorder = new MediaRecorder(stream);

 // Add the recorded data to the chunks array
 mediaRecorder.ondataavailable = async (e) => {
 chunks.push(e.data);
 }

 // Transcode the recorded video data after the MediaRecorder stops
 mediaRecorder.onstop = async () => {
 await transcode(new Uint8Array(await (new Blob(chunks)).arrayBuffer()));

 // Clear the chunks array after transcoding
 chunks = [];

 // Start the MediaRecorder again after a 0 millisecond delay
 setTimeout(() => {
 mediaRecorder.start();
 
 // Stop the MediaRecorder after 3 seconds
 setTimeout(() => {
 mediaRecorder.stop();
 }, 500);
 }, 0);
 }

 // Start the MediaRecorder
 mediaRecorder.start();

 // Stop the MediaRecorder after 3 seconds
 setTimeout(() => {
 mediaRecorder.stop();
 }, 700);
 })
 }
 
 useEffect(() => {
 // Set up event listeners for the socket connection
 socket.on('/', function(){
 // Log a message when the client is connected to the server
 console.log("Connected to server!"); 
 });

 socket.on('transcoded-video', function(data){
 // Log the received data for debugging purposes
 console.log("Received transcoded video data:", data); 
 });

 socket.on('notice', function(data){
 // Emit a "notice" event back to the server to acknowledge the received data
 socket.emit("notice", "ping server!");
 });

 socket.on('bye', function(data){
 // Log the received data and disconnect from the server
 console.log("Server sent:", data); 
 socket.disconnect();
 });

 socket.on('disconnect', function(){
 // Log a message when the client is disconnected from the server
 console.log("Disconnected from server!"); 
 });
 }, [])

 return (
 <div classname="App">
 <div>
 <video muted="{true}"></video>
 <video autoplay="autoplay"></video>
 </div>
 <button>start streaming</button>
 </div>
 );
}

export default App;


What can i do to fix it ? thank you !!


-
I have use the ffmpeg in my react konva project but it not import correclty ?
5 septembre 2024, par Humayoun SaeedI use ffmpeg in my react konva project to record video and download it, but when i import it give me error, when i give to to gpt or google it giveme another way of export when i do this one it same give me error of import from ffpmg


Error :


ERROR in ./src/components/Preview.jsx 29:25-37
export 'createFFmpeg' (imported as 'createFFmpeg') was not found in '@ffmpeg/ffmpeg' (possible exports : FFmpeg)
ERROR in ./src/components/Preview.jsx 123:34-43
export 'fetchFile' (imported as 'fetchFile') was not found in '@ffmpeg/ffmpeg' (possible exports : FFmpeg)


Preview.jsx :


import React, { useEffect, useState, useRef } from "react";
// import { createFFmpeg } from "@ffmpeg/ffmpeg";
// import { createFFmpeg, fetchFile } from "@ffmpeg/ffmpeg/dist/ffmpeg.min.js";
// import { FFmpeg } from "@ffmpeg/ffmpeg";
// import { fetchFile } from "@ffmpeg/util";
import { createFFmpeg, fetchFile } from "@ffmpeg/ffmpeg";



const Preview = ({ layout, onClose }) => {
 const [currentContent, setCurrentContent] = useState([]);
 const [progress, setProgress] = useState(0);
 const totalDuration = useRef(0);
 const elapsedDuration = useRef(0); // Track total elapsed duration
 const progressInterval = useRef(null);
 const ffmpeg = useRef(null); // Use useRef to store ffmpeg instance
 const [ffmpegReady, setFfmpegReady] = useState(false);

 // Initialize FFmpeg instance
 useEffect(() => {
 const loadFFmpeg = async () => {
 if (!ffmpeg.current) {
 ffmpeg.current = createFFmpeg({ log: true });
 await ffmpeg.current.load();
 setFfmpegReady(true);
 }
 };
 loadFFmpeg();
 }, []);




const handleDownload = async () => {
 try {
 if (!ffmpegReady) {
 alert("FFmpeg is still loading, please wait...");
 return;
 }

 // Fetch all media files from the layout
 const inputFiles = [];

 // Process each division of the layout
 for (const division of layout.divisions) {
 for (let i = 0; i < division.imageSrcs.length; i++) {
 const src = division.imageSrcs[i];

 // Fetch and store media data
 const mediaData = await fetchFile(src);
 const fileName = `input${inputFiles.length + 1}${
 src.endsWith(".mp4") ? ".mp4" : ".png"
 }`;

 // Write file to ffmpeg virtual filesystem
 ffmpeg.current.FS("writeFile", fileName, mediaData);
 inputFiles.push(fileName);
 }
 }

 // Create a list of inputs for ffmpeg
 let concatList = "";
 inputFiles.forEach((fileName) => {
 concatList += `file '${fileName}'\n`;
 });

 // Write the concat list file to FFmpeg FS
 ffmpeg.current.FS(
 "writeFile",
 "concatList.txt",
 new TextEncoder().encode(concatList)
 );

 // Run the ffmpeg command to concatenate all files into one video
 await ffmpeg.current.run(
 "-f",
 "concat",
 "-safe",
 "0",
 "-i",
 "concatList.txt",
 "-c",
 "copy",
 "output.mp4"
 );

 // Read the result video
 const data = ffmpeg.current.FS("readFile", "output.mp4");

 // Create a Blob from the data and download it
 const videoBlob = new Blob([data.buffer], { type: "video/mp4" });
 const url = URL.createObjectURL(videoBlob);
 const link = document.createElement("a");
 link.href = url;
 link.download = `${layout.name || "layout_video"}.mp4`;
 document.body.appendChild(link);
 link.click();
 document.body.removeChild(link);

 alert("Video download completed.");
 } catch (error) {
 console.error("Error during video creation:", error);
 }
 };


 



return (
 
 
 
 Close
 
 
 {/* Download button */}
 > (e.target.style.backgroundColor = "#218838")}
 onMouseOut={(e) => (e.target.style.backgroundColor = "#28a745")}
 >
 Download Video
 
 
 
 );
};

export default Preview;



Ignore all other main issue in just ffmpeg , import, declaration and in it usage in download function, if anyone solution or ability to resolve it, then check it.


I try to use ffmpeg in my project for video downloading but it not importing and not use , i want to download video i made using ffmpeg.


-
ffmpeg RTSP stream decoding memory leak
6 février 2019, par HarisI need to decode rtsp stream from Ip camera using ffmpeg, below is the code for decoder
ffmpeg_decoder.h
class ffmpeg_decoder
{
public:
ffmpeg_decoder();
int initial(QString & url);
int h264Decodec();
void close_stream();
virtual ~ffmpeg_decoder();
AVPicture picture;
int width;
int height;
QMutex mutex;
QImage imageDecoded;
private:
AVFormatContext *pFormatCtx;
AVCodecContext *pCodecCtx;
AVFrame *pFrame;
AVPacket packet;
SwsContext * pSwsCtx;
int videoStream;
QString rtspURL;
};ffmpeg_decoder.cpp
ffmpeg_decoder::ffmpeg_decoder()
{
pCodecCtx = NULL;
videoStream=-1;
}
ffmpeg_decoder::~ffmpeg_decoder()
{
sws_freeContext(pSwsCtx);
}
int ffmpeg_decoder::initial(QString & url)
{
int err;
rtspURL=url;
AVCodec *pCodec;
av_register_all();
avformat_network_init();
pFormatCtx = avformat_alloc_context();
pFrame = av_frame_alloc();
err = avformat_open_input(&pFormatCtx, rtspURL.toStdString().c_str(), NULL,
NULL);
if (err < 0)
{
printf("Can not open this file");
return -1;
}
if (avformat_find_stream_info(pFormatCtx,NULL) < 0)
{
printf("Unable to get stream info");
return -1;
}
int i = 0;
videoStream = -1;
for (i = 0; i < pFormatCtx->nb_streams; i++)
{
if (pFormatCtx->streams[i]->codec->codec_type == AVMEDIA_TYPE_VIDEO)
{
videoStream = i;
break;
}
}
if (videoStream == -1)
{
printf("Unable to find video stream");
return -1;
}
pCodecCtx = pFormatCtx->streams[videoStream]->codec;
width=pCodecCtx->width;
height=pCodecCtx->height;
avpicture_alloc(&picture,PIX_FMT_RGB24,pCodecCtx->width,pCodecCtx->height);
pCodec = avcodec_find_decoder(pCodecCtx->codec_id);
pSwsCtx = sws_getContext(width, height, PIX_FMT_YUV420P, width,
height, PIX_FMT_RGB24,
SWS_BICUBIC, 0, 0, 0);
if (pCodec == NULL)
{
printf("Unsupported codec");
return -1;
}
printf("video size : width=%d height=%d \n", pCodecCtx->width,
pCodecCtx->height);
if (avcodec_open2(pCodecCtx, pCodec, NULL) < 0)
{
printf("Unable to open codec");
return -1;
}
printf("initial successfully");
return 0;
}
int ffmpeg_decoder::h264Decodec()
{
int frameFinished=0;
// while (av_read_frame(pFormatCtx, &packet) >= 0)
if(av_read_frame(pFormatCtx, &packet) >= 0)
{
if(packet.stream_index==videoStream)
{
avcodec_decode_video2(pCodecCtx, pFrame, &frameFinished, &packet);
if (frameFinished)
{
printf("***************ffmpeg decodec*******************\n");
mutex.lock();
int rs = sws_scale(pSwsCtx, (const uint8_t* const *) pFrame->data,
pFrame->linesize, 0,
height, picture.data, picture.linesize);
imageDecoded = QImage();
imageDecoded= QImage(this->picture.data[0],this->width,this->height,QImage::Format_RGB888);
//imageDecoded = imageDecoded.copy();
mutex.unlock();
if (rs == -1)
{
printf("__________Can open to change to des imag_____________e\n");
return -1;
}
}
}
}
av_free_packet(&packet);
av_frame_unref(pFrame);
av_packet_unref(&packet);
avpicture_free(&picture);
return 1;
}
void ffmpeg_decoder::close_stream(){
/*if (pFrame)
av_free(&pFrame);*/
if (pCodecCtx)
avcodec_close(pCodecCtx);
if (pSwsCtx)
sws_freeContext(pSwsCtx);
avpicture_free(&picture);
if (pFormatCtx)
avformat_close_input(&pFormatCtx);
}Below is the main thread which do the decoding.
I am using Qt for creating thread and do decoding
ffmpeg_decoder * ffmpeg = new ffmpeg_decoder();;
if(ffmpeg->initial(rtspURL)==0){
while (1) {
ffmpeg->h264Decodec();
//get frame and do processing right now it disabled, and still see the memory leak.
.......
if(stopFlg.load()==1)
break;
}
//close stream if break
ffmpeg->close_stream();
}
else {
ffmpeg->close_stream();
}When I run 36 thread with different URL I can see the memory usage of the program increase over time.
I have used valgrind to detect the leak, and here is the relevant part of the log
This is the first memory leak location
=14402== by 0x692017F: av_malloc (in /usr/lib/x86_64-linux-gnu/libavutil-ffmpeg.so.54.31.100)
==14402== by 0x692048D: av_mallocz (in /usr/lib/x86_64-linux-gnu/libavutil-ffmpeg.so.54.31.100)
==14402== by 0x691915E: av_frame_alloc (in /usr/lib/x86_64-linux-gnu/libavutil-ffmpeg.so.54.31.100)
==14402== by 0x419663: ffmpeg_decoder::initial(QString&) (ffmpeg_decoder.cpp:24)
==14402== by 0x41ABEC: RTSP_Player_Object::run() (rtsp_player_object.cpp:15)Another
==14402== 2,176 bytes in 16 blocks are indirectly lost in loss record 23,113 of 23,379
==14402== at 0x4C2E0EF: operator new(unsigned long) (in /usr/lib/valgrind/vgpreload_memcheck-amd64-linux.so)
==14402== by 0x7780A4E: QImageData::create(unsigned char*, int, int, int, QImage::Format, bool, void (*)(void*), void*) (in /home/vapplica/Qt5.11.1/5.11.1/gcc_64/lib/libQt5Gui.so.5.11.1)
==14402== by 0x7780C30: QImage::QImage(unsigned char*, int, int, QImage::Format, void (*)(void*), void*) (in /home/vapplica/Qt5.11.1/5.11.1/gcc_64/lib/libQt5Gui.so.5.11.1)
==14402== by 0x419B21: ffmpeg_decoder::h264Decodec() (ffmpeg_decoder.cpp:96)I have check the documentation and sample on ffmpeg site, and I think I am releasing the allocated memory, but still I can see the memory leak when I run the program.
Syndiquer tout le site
