Essayez de créer vous-même un pipeline de streaming vidéo en direct : À propos de FFmpeg et MediaMTX

Vous avez déjà voulu regarder les flux en direct de caméras de sécurité ou d’appareils IoT dans votre navigateur Web ? Ça semble simple, mais en réalité, c’est très compliqué à mettre en place.

Où est le problème ?

Les caméras IP diffusent en RTSP (Real Time Streaming Protocol), mais les navigateurs ne prennent pas en charge le RTSP. Depuis les années 2010, pour des raisons de sécurité, les navigateurs ont supprimé la prise en charge de RTSP. En clair, la caméra et le navigateur ne parlent pas le même langage.

Pour résoudre ce problème, il existe deux outils magiques :

FFmpeg — Le dieu du traitement vidéo. Un outil polyvalent utilisé aussi bien dans VLC que dans la chaîne d’encodage de Netflix.

MediaMTX — Un serveur de streaming léger. Il fait notamment la conversion RTSP → WebRTC.

Il y a 3 étapes à suivre

1. Diffuser un fichier vidéo en streaming

Créez un fichier de configuration MediaMTX (mediamtx.yml) : yaml paths: test_video: source: publisher

Diffusez le fichier en RTSP : bash ffmpeg -re -i your_video.mp4 -c:v libx264 -preset fast -c:a aac -f rtsp rtsp://localhost:8554/test_video

Vous pouvez vérifier avec VLC.

2. Diffuser une webcam en temps réel

Ajoutez à la configuration de MediaMTX : yaml paths: webcam: source: publisher

Windows : bash ffmpeg -f dshow -rtbufsize 100M -i video=“Integrated Webcam” -c:v libx264 -preset ultrafast -tune zerolatency -f rtsp rtsp://localhost:8554/webcam

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

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

3. Rendre le flux visible dans le navigateur (magie WebRTC)

C’est là que ça devient vraiment intéressant. Activez la compatibilité WebRTC dans MediaMTX :

yaml webrtc: yes webrtcAddress: :8889 webrtcEncryption: no webrtcAllowOrigin: ‘*’ webrtcLocalUDPAddress: :8189 webrtcIPsFromInterfaces: yes

paths: test_video: source: publisher webcam: source: publisher

Ouvrez http://localhost:8889/ dans votre navigateur, et le flux RTSP sera automatiquement converti en WebRTC et affiché dans le navigateur. C’est tout.

Schéma du flux de données

1. Caméra → images brutes
2. FFmpeg → encodage H.264 → diffusion RTSP
3. MediaMTX → réception RTSP
4. Navigateur → requête WebRTC
5. MediaMTX → conversion automatique → diffusion WebRTC
6. Navigateur → lecture en temps réel

La conversion se fait sans ré-encodage, donc c’est très efficace. Les systèmes à grande échelle de Netflix utilisent le même principe.

Et après ?

La configuration actuelle est au niveau démo. Ce qui manque pour la production :

• Pas d’authentification
• Uniquement en localhost
• Non compatible avec de vraies caméras IP
• Pas de gestion des erreurs

Dans la partie 2, nous ajouterons la sécurité, la connexion à de vraies caméras IP et l’adaptation à la production.