Recherche avancée

Médias (1)

Mot : - Tags -/censure

Autres articles (44)

  • List of compatible distributions

    26 avril 2011, par

    The table below is the list of Linux distributions compatible with the automated installation script of MediaSPIP. Distribution nameVersion nameVersion number Debian Squeeze 6.x.x Debian Weezy 7.x.x Debian Jessie 8.x.x Ubuntu The Precise Pangolin 12.04 LTS Ubuntu The Trusty Tahr 14.04
    If you want to help us improve this list, you can provide us access to a machine whose distribution is not mentioned above or send the necessary fixes to add (...)

  • Demande de création d’un canal

    12 mars 2010, par

    En fonction de la configuration de la plateforme, l’utilisateur peu avoir à sa disposition deux méthodes différentes de demande de création de canal. La première est au moment de son inscription, la seconde, après son inscription en remplissant un formulaire de demande.
    Les deux manières demandent les mêmes choses fonctionnent à peu près de la même manière, le futur utilisateur doit remplir une série de champ de formulaire permettant tout d’abord aux administrateurs d’avoir des informations quant à (...)

  • Changer son thème graphique

    22 février 2011, par

    Le thème graphique ne touche pas à la disposition à proprement dite des éléments dans la page. Il ne fait que modifier l’apparence des éléments.
    Le placement peut être modifié effectivement, mais cette modification n’est que visuelle et non pas au niveau de la représentation sémantique de la page.
    Modifier le thème graphique utilisé
    Pour modifier le thème graphique utilisé, il est nécessaire que le plugin zen-garden soit activé sur le site.
    Il suffit ensuite de se rendre dans l’espace de configuration du (...)

Sur d’autres sites (6726)

  • FFMPEG ERROR on streaming video generated from MediaRecorder API on RTMP url

    20 février 2024, par Prince Mishra

    Ref : https://www.mux.com/blog/the-state-of-going-live-from-a-browser

    


    The above blog states my problem in detail and presented a solution also.
I am trying to implement the solution which is using socketio

    


    Here is the description of the problem :

    


    I want to capture the video and audio from the browser using

    


    navigator.mediaDevices
    .getUserMedia({ video: true, audio: true })


    


    and i am using the

    


    const options = {
    mimeType: "video/webm;codecs=vp8",
};
const mediaRecorder = new MediaRecorder(stream, options);


    


    to record the video chunk by chunk from the stream given by getusermedia and then using the socket io to send the video to the backend. Where I am using the ffmpeg to stream the chunks on rtmp url.

    


    I am using the following ffmpeg commands :

    


    const { spawn } = require('child_process');

const ffmpegProcess = spawn('ffmpeg', [
    '-i', 'pipe:0',
    '-c:v', 'libx264',
    '-preset', 'veryfast',
    '-tune', 'zerolatency',
    '-c:a', 'aac',
    '-ar', '44100',
    '-f', 'flv',
    rtmpurl
]);


    


    And I am getting the following errors :

    


    Error Image 1

    


    Error Image 2

    


    Error Image 3

    


    Can anyone help me how to fix this. I am new to FFmpeg.

    


    Here is the complete frontend and Backend code :

    


    Frontend (App.jsx) :


    


    import { useEffect } from "react";&#xA;import "./App.css";&#xA;import io from "socket.io-client";&#xA;&#xA;function App() {&#xA;  let video;&#xA;&#xA;  useEffect(() => {&#xA;    video = document.getElementById("video");&#xA;  }, []);&#xA;&#xA;  const socket = io("http://localhost:3050");&#xA;  socket.on("connect", () => {&#xA;    console.log("Connected to server");&#xA;  });&#xA;&#xA;  let stream;&#xA;  navigator.mediaDevices&#xA;    .getUserMedia({ video: true, audio: true })&#xA;    .then((strea) => {&#xA;      video.srcObject = strea;&#xA;      stream = strea;&#xA;      const options = {&#xA;        mimeType: "video/webm;codecs=vp8",&#xA;      };&#xA;      const mediaRecorder = new MediaRecorder(stream, options);&#xA;      console.log(mediaRecorder);&#xA;      let chunks = [];&#xA;&#xA;      mediaRecorder.ondataavailable = function (e) {&#xA;        chunks.push(e.data);&#xA;        console.log(e.data);&#xA;      };&#xA;      mediaRecorder.onstop = function (e) {&#xA;        const blob = new Blob(chunks, { type: "video/webm;codecs=vp8" });&#xA;        console.log("emitted");&#xA;        socket.emit("videoChunk", blob);&#xA;        chunks = [];&#xA;        // const videoURL = URL.createObjectURL(blob);&#xA;        // const a = document.createElement(&#x27;a&#x27;);&#xA;        // a.href = videoURL;&#xA;        // a.download = &#x27;video.mp4&#x27;;&#xA;        // a.click();&#xA;        window.URL.revokeObjectURL(videoURL);&#xA;      };&#xA;      mediaRecorder.start();&#xA;      setInterval(() => {&#xA;        mediaRecorder.stop();&#xA;        mediaRecorder.start();&#xA;      }, 2000);&#xA;    })&#xA;    .catch((error) => {&#xA;      console.error("Error accessing camera:", error);&#xA;    });&#xA;&#xA;  // Capture video after 10 seconds&#xA;&#xA;  return (&#xA;    &lt;>&#xA;      <video width="640" height="480" autoplay="autoplay"></video>&#xA;      <button>Capture</button>&#xA;    >&#xA;  );&#xA;}&#xA;&#xA;export default App;&#xA;

    &#xA;

    Backend Code :

    &#xA;

    const express = require(&#x27;express&#x27;);&#xA;const http = require(&#x27;http&#x27;);&#xA;const socketIo = require(&#x27;socket.io&#x27;);&#xA;const { spawn } = require(&#x27;child_process&#x27;);&#xA;&#xA;const app = express();&#xA;&#xA;const server = http.createServer(app);&#xA;const io = socketIo(server, {&#xA;    cors: {&#xA;      origin: "*",&#xA;      methods: ["GET", "POST"]&#xA;    }, maxhttpBufferSize: 1e8&#xA;  });&#xA;&#xA;  const rtmpurl = &#x27;rtmp://localhost/live/test&#x27;;&#xA;&#xA;io.on(&#x27;connection&#x27;, (socket) => {&#xA;    console.log(&#x27;A user connected&#x27;);&#xA;&#xA;    const ffmpegProcess = spawn(&#x27;ffmpeg&#x27;, [&#xA;        &#x27;-i&#x27;, &#x27;pipe:0&#x27;,&#xA;        &#x27;-c:v&#x27;, &#x27;libx264&#x27;,&#xA;        &#x27;-preset&#x27;, &#x27;veryfast&#x27;,&#xA;        &#x27;-tune&#x27;, &#x27;zerolatency&#x27;,&#xA;        &#x27;-c:a&#x27;, &#x27;aac&#x27;,&#xA;        &#x27;-ar&#x27;, &#x27;44100&#x27;,&#xA;        &#x27;-f&#x27;, &#x27;flv&#x27;,&#xA;        rtmpurl&#xA;    ]);&#xA;&#xA;&#xA;    ffmpegProcess.stdin.on(&#x27;error&#x27;, (e) => {&#xA;        console.log(e);&#xA;    });&#xA;    &#xA;    ffmpegProcess.stderr.on(&#x27;data&#x27;, (data) => {&#xA;        console.log(data.toString());&#xA;    });&#xA;&#xA;    ffmpegProcess.on(&#x27;close&#x27;, (code) => {&#xA;        console.log(`child process exited with code ${code}`);&#xA;    });&#xA;&#xA;&#xA;    socket.on(&#x27;videoChunk&#x27;, (chunk) => {&#xA;        console.log(chunk)&#xA;        ffmpegProcess.stdin.write(chunk);&#xA;&#xA;    });&#xA;&#xA;    socket.on(&#x27;disconnect&#x27;, () => {&#xA;        console.log(&#x27;User disconnected&#x27;);&#xA;        ffmpegProcess.stdin.end();&#xA;    });&#xA;});&#xA;&#xA;const PORT = process.env.PORT || 3050;&#xA;&#xA;app.get(&#x27;/test&#x27;, (req, res) => {&#xA;    res.send(&#x27;Hello from /test route!&#x27;);&#xA;});&#xA;&#xA;&#xA;server.listen(PORT, () => {&#xA;    console.log(`Server is running on port ${PORT}`);&#xA;});&#xA;

    &#xA;

  • No audio in the final video when converting webm blobs to mp4 using ffmpeg

    28 septembre 2024, par alpecca

    I trying to record user camera and microphone and using MediaRecorder to convert the stream to blobs and sending the blobs every 2 second to the backend using websocket. Everything is working fine, but when I checked the final mp4 video in the backend, it doesn't have any audio to it, I try specifying the audio codec, but still no help.

    &#xA;

    My frontend code :-

    &#xA;

    const micStream = await navigator.mediaDevices.getUserMedia({ audio: true });&#xA;&#xA;const recorder = new MediaRecorder(stream, {&#xA;   mimeType: &#x27;video/webm;codecs=H264&#x27;,&#xA;   videoBitsPerSecond: 8000000,&#xA;   audioBitsPerSecond : 8000000&#xA;});&#xA;&#xA;recorder.ondataavailable = (e: BlobEvent) => {&#xA;    websocket.send(e.data)         &#xA;}  &#xA;recorder.start(2000);&#xA;

    &#xA;

    And here is the backend code :-

    &#xA;

    @router.websocket("/streamaudio")&#xA;async def websocket_endpoint(websocket: WebSocket):&#xA;    await manager.connect(websocket)&#xA;&#xA;    recordingFile = os.path.join(os.getcwd(), f"recording_.mp4")&#xA;&#xA;    command = [&#xA;        &#x27;ffmpeg&#x27;, &#xA;        &#x27;-y&#x27;,&#xA;        &#x27;-i&#x27;, &#xA;        &#x27;-&#x27;, &#xA;        &#x27;-codec:v&#x27;, &#xA;        &#x27;copy&#x27;, &#xA;        &#x27;-c:a&#x27;, &#x27;aac&#x27;, &#xA;        &#x27;-y&#x27;,&#xA;        &#x27;-f&#x27;, &#x27;mp4&#x27;,&#xA;        recordingFile,&#xA;        # "-"&#xA;        # f&#x27;output{queueNumber}.mp4&#x27;,&#xA;    ]  &#xA;&#xA;    &#xA;    try:&#xA;        while True:&#xA;            try:&#xA;           &#xA;                data = await websocket.receive_bytes()&#xA;                &#xA;                process.stdin.send(data)&#xA;               &#xA;            except RuntimeError:&#xA;                break      &#xA;    except WebSocketDisconnect:&#xA;        print(f"Client disconnected: {websocket.client.host}")&#xA;    finally:&#xA;        manager.disconnect(websocket)&#xA;        await process.stdin.aclose()&#xA;        await process.wait()  &#xA;

    &#xA;

  • Unable to read video streams on FFMPEG and send it to youTube RTMP server

    29 août 2024, par Rahul Bundele

    I'm trying to send two video stream from browser as array buffer (webcam and screen share video) to server via Web RTC data channels and want ffmpeg to add webcam as overlay on screen share video and send it to youtube RTMP server, the RTC connections are established and server does receives buffer , Im getting error in Ffmpeg..error is at bottom , any tips on to add overlay and send it to youtube RTMP server would be appreciated.

    &#xA;

    Client.js

    &#xA;

    `&#xA;const webCamStream = await navigator.mediaDevices.getUserMedia( video : true ,audio:true ) ;&#xA;const screenStream = await navigator.mediaDevices.getDisplayMedia( video : true ) ;

    &#xA;

    const webcamRecorder = new MediaRecorder(webCamStream, { mimeType: &#x27;video/webm&#x27; });&#xA;webcamRecorder.ondataavailable = (event) => {&#xA;    if (event.data.size > 0 &amp;&amp; webcamDataChannel.readyState === &#x27;open&#x27;) {&#xA;        const reader = new FileReader();&#xA;        reader.onload = function () {&#xA;            const arrayBuffer = this.result;&#xA;            webcamDataChannel.send(arrayBuffer);&#xA;        };&#xA;        reader.readAsArrayBuffer(event.data);&#xA;    }&#xA;};&#xA;webcamRecorder.start(100);  // Adjust the interval as needed&#xA;&#xA;// Send screen share stream data&#xA;const screenRecorder = new MediaRecorder(screenStream, { mimeType: &#x27;video/webm&#x27; });&#xA;screenRecorder.ondataavailable = (event) => {&#xA;    if (event.data.size > 0 &amp;&amp; screenDataChannel.readyState === &#x27;open&#x27;) {&#xA;        const reader = new FileReader();&#xA;        reader.onload = function () {&#xA;            const arrayBuffer = this.result;&#xA;            screenDataChannel.send(arrayBuffer);&#xA;        };&#xA;        reader.readAsArrayBuffer(event.data);&#xA;    }&#xA;};&#xA;screenRecorder.start(100); &#xA;

    &#xA;

    `

    &#xA;

    Server.js

    &#xA;

    const youtubeRTMP = &#x27;rtmp://a.rtmp.youtube.com/live2/youtube key&#x27;;&#xA;&#xA;// Create PassThrough streams for webcam and screen&#xA;const webcamStream = new PassThrough();&#xA;const screenStream = new PassThrough();&#xA;&#xA;// FFmpeg arguments for processing live streams&#xA;const ffmpegArgs = [&#xA;  &#x27;-re&#x27;,&#xA;  &#x27;-i&#x27;, &#x27;pipe:3&#x27;,                  // Webcam input via pipe:3&#xA;  &#x27;-i&#x27;, &#x27;pipe:4&#x27;,                  // Screen share input via pipe:4&#xA;  &#x27;-filter_complex&#x27;,               // Complex filter for overlay&#xA;  &#x27;[0:v]scale=320:240[overlay];[1:v][overlay]overlay=10:10[out]&#x27;,&#xA;  &#x27;-map&#x27;, &#x27;[out]&#x27;,                 // Map the output video stream&#xA;  &#x27;-c:v&#x27;, &#x27;libx264&#x27;,               // Use H.264 codec for video&#xA;  &#x27;-preset&#x27;, &#x27;ultrafast&#x27;,          // Use ultrafast preset for low latency&#xA;  &#x27;-crf&#x27;, &#x27;25&#x27;,                    // Set CRF for quality/size balance&#xA;  &#x27;-pix_fmt&#x27;, &#x27;yuv420p&#x27;,           // Pixel format for compatibility&#xA;  &#x27;-c:a&#x27;, &#x27;aac&#x27;,                   // Use AAC codec for audio&#xA;  &#x27;-b:a&#x27;, &#x27;128k&#x27;,                  // Set audio bitrate&#xA;  &#x27;-f&#x27;, &#x27;flv&#x27;,                     // Output format (FLV for RTMP)&#xA;  youtubeRTMP                      // Output to YouTube RTMP server&#xA;];&#xA;&#xA;// Spawn the FFmpeg process&#xA;const ffmpegProcess = spawn(&#x27;ffmpeg&#x27;, ffmpegArgs, {&#xA;  stdio: [&#x27;pipe&#x27;, &#x27;pipe&#x27;, &#x27;pipe&#x27;, &#x27;pipe&#x27;, &#x27;pipe&#x27;]&#xA;});&#xA;&#xA;// Pipe the PassThrough streams into FFmpeg&#xA;webcamStream.pipe(ffmpegProcess.stdio[3]);&#xA;screenStream.pipe(ffmpegProcess.stdio[4]);&#xA;&#xA;ffmpegProcess.on(&#x27;close&#x27;, code => {&#xA;  console.log(`FFmpeg process exited with code ${code}`);&#xA;});&#xA;&#xA;ffmpegProcess.on(&#x27;error&#x27;, error => {&#xA;  console.error(`FFmpeg error: ${error.message}`);&#xA;});&#xA;&#xA;const handleIncomingData = (data, stream) => {&#xA;  const buffer = Buffer.from(data);&#xA;  stream.write(buffer);&#xA;};&#xA;

    &#xA;

    the server gets the video buffer via webrtc data channels

    &#xA;

    pc.ondatachannel = event => {&#xA;        const dataChannel = event.channel;&#xA;        pc.dc = event.channel;&#xA;        pc.dc.onmessage = event => {&#xA;            // Spawn the FFmpeg process&#xA;            // console.log(&#x27;Message from client:&#x27;, event.data);&#xA;            const data = event.data;&#xA;&#xA;            if (dataChannel.label === &#x27;webcam&#x27;) {&#xA;            handleIncomingData(data, webcamStream);&#xA;            } else if (dataChannel.label === &#x27;screen&#x27;) {&#xA;            handleIncomingData(data, screenStream);&#xA;            }&#xA;          &#xA;        };&#xA;        pc.dc.onopen = e=>{&#xA;            // recHead.innerText = "Waiting for user to send files"&#xA;            console.log("channel opened!")&#xA;        }&#xA;    };&#xA;

    &#xA;

    Im getting this error in ffmpeg

    &#xA;

    [in#0 @ 0000020e585a1b40] Error opening input: Bad file descriptor&#xA;Error opening input file pipe:3.&#xA;Error opening input files: Bad file descriptor&#xA;

    &#xA;