Construire soi-même un pipeline de diffusion vidéo en direct : Guide pratique FFmpeg×MediaMTX

Problème : La caméra parle en RTSP, mais le navigateur ne peut pas comprendre.

Supposons que vous souhaitiez afficher des images en direct provenant de caméras de sécurité ou de dispositifs IoT dans une application Web. La plupart des caméras diffusent via RTSP (Real Time Streaming Protocol). Cependant, les navigateurs ont abandonné la prise en charge de RTSP depuis les années 2010. En d'autres termes, le problème fondamental réside dans le fait que “la langue que parle la caméra” et “la langue que le navigateur peut comprendre” sont différentes.

La traduction est assurée par FFmpeg (le couteau suisse du traitement vidéo) et MediaMTX (serveur de conversion de protocole). En combinant ces deux outils, vous pouvez créer un pipeline de streaming à faible latence digne des professionnels.

Explication des outils

FFmpeg : la baguette magique pour convertir n'importe quel format vidéo

Flux de traitement FFmpeg :

• Démultiplexage : Séparer la vidéo et l'audio du conteneur
• Décoder : convertir les données compressées en trame brute
• Filtrage : application de l'échelle, de la correction des couleurs, etc.
• Encodage : compression en H.264 ou VP9
• Multiplex : emballage dans le conteneur de sortie

Pour les applications de streaming, FFmpeg fonctionne comme moteur d'entrée. Il capture des vidéos à partir de webcams ou de fichiers, encode efficacement et les envoie au serveur via RTSP ou RTMP.

MediaMTX : un hub de protocole prenant en charge plusieurs clients

FFmpeg n'a qu'une seule sortie, tandis que MediaMTX peut diffuser simultanément à plusieurs clients. De plus :

• Réception via RTSP/RTMP/WebRTC/HLS
• Reconditionnement pour différents clients
• Convertir RTSP en WebRTC (jouable dans le navigateur)
• Authentification, répartition de charge, gestion des clients

Avec un seul binaire et un fichier de configuration YAML, il est possible de gérer des scénarios complexes qui nécessitaient auparavant plusieurs serveurs dédiés.

Étapes d'implémentation

Étape 1 : Installer l'outil

Ubuntu/Débian :

sudo apt update sudo apt install autoconf automake build-essential pkg-config libx264-dev libvpx-dev libfdk-aac-dev git clone ffmpeg cd ffmpeg ./configure --enable-gpl --enable-libx264 --enable-nonfree make -j$(nproc) sudo make install

macOS:

brew install ffmpeg

Windows : Téléchargez depuis gydan.dev → Décompressez dans C:\ffmpeg → Ajoutez au PATH du système

MediaMTX v1.15.0 est également installé (facile avec un seul binaire).

Étape 2 : Diffusion de fichier vidéo

Créer un mediamtx.yml :

chemins: test_video: source : éditeur

Lancer MediaMTX :

mediamtx mediamtx.yml

Diffuser une vidéo via RTSP avec FFmpeg :

ffmpeg -re -i video.mp4 -c:v libx264 -preset fast -c:a aac -f rtsp rtsp://localhost:8554/test_video

-re : maintien du taux de rafraîchissement (nécessaire pour le streaming en direct) -preset fast : équilibre de la vitesse d'encodage

Vérifiez avec VLC Media Player : Média → Ouvrir un flux réseau → rtsp://localhost:8554/test_video

Étape 3 : Diffusion en direct avec la webcam

Windows :

ffmpeg -f dshow -rtbufsize 100M -i video=“Webcam intégrée” -c:v libx264 -preset ultrafast -tune zerolatency -f rtsp rtsp://localhost:8554/webcam

macOS:

ffmpeg -f avfoundation -framerate 30 -video_size 1280x720 -i “0” -c:v libx264 -preset ultrafast -tune zerolatency -f rtsp rtsp://localhost:8554/webcam

Linux :

ffmpeg -f v4l2 -i /dev/video0 -c:v libx264 -preset ultrafast -tune zerolatency -c:a aac -f rtsp rtsp://localhost:8554/webcam

-tune zerolatency est un point clé. Optimisation du streaming en temps réel.

Étape 4 : Lecture dans le navigateur (WebRTC)

mise à jour de mediamtx.yml :

webrtc : oui webrtcAddress: :8889 webrtcEncryption : non webrtcAllowOrigin: '*'}

chemins: webcam : source : éditeur

Redémarrez MediaMTX et ouvrez http://localhost:8889 dans votre navigateur → le flux en direct s'affiche dans le navigateur.

Flux de données

1. Webcam → Génération de trames en direct
2. FFmpeg → Encodage en H.264 et diffusion RTSP
3. MediaMTX → Réception RTSP et conversion WebRTC
4. Navigateur → Lecture en temps réel avec WebRTC

MediaMTX ne réencode pas. Il se contente de reconditionner un flux H.264 dans un conteneur de protocole différent. C'est pourquoi il permet d'atteindre une faible latence.

Résumé de cette fois

Pipeline de base complétée :

• FFmpeg et MediaMTX installés
• Vérification du streaming des fichiers vidéo et de la webcam
• Lecture réussie via WebRTC dans le navigateur

Cependant, il y a des défis dans l'exploitation en production :

• Pas d'authentification ni de sécurité
• Fonctionne uniquement sur localhost
• Non pris en charge par les caméras IP réelles
• Pas de gestion des erreurs

Dans la partie 2, nous aborderons l'ajout d'authentification, la connexion de la caméra IP et la compatibilité Internet.