Bonjour,

Je dois afficher un flux vidéo rtsp dans mon app vue3, je sais que je ne peux pas lire ce flux directement. J'aimerais savoir comment faire (ffmpeg ou autre solution) et surtout avoir un retour d'xp sur ce genre d'intégration...

Merci d'avance

3 réponses


Je n'ai jamais fait ça mais du coup j'imagine qu'il faut que tu trouve un outil qui convertisse le flux en qqchose lisible par le player HTML5

cid5420
Auteur

Oui mais sur cette partie que je m'arrache les cheveux, en fait l'idée est de faire du webrtc entre une webcam et un caméra ip avec un flux rtsp.. En cherchant un peu, je trouve pas mal de choses avec les serveur ffmpeg mais j'ai du mal à tout capter...

Bonjour, j'ai déjà eu besoin de convertir un flux video non-compatible pour le navigateur (.mkv, .avi) vers un flux compatible (.mp4), en Nodejs,
j'avais trouvé le fluent-ffmpeg qui est un driver pour ffmpeg (donc nécessite que ffmpeg soint installé est accessible par Nodejs), qui va permettre de convertir des flux a la volée
Sur le Github du fluent-ffmpeg il y a un dossier examples qui montre certains cas d'utilisation.

Un cas d'utilisation est montré par le fichier any-to-mp4.js qui montre comment convertir n'importe quel type vers mp4 avec le ffmpeg.

L'exemple est très simple est prend des fichiers système pour créé les flux:

var fs = require('fs');
var path = require('path');
var ffmpeg = require('../index');

var pathToSourceFile = path.resolve(__dirname, '../test/assets/testvideo-169.avi');
var readStream = fs.createReadStream(pathToSourceFile);
var writeStream = fs.createWriteStream('./output.mp4');

ffmpeg(readStream)
  .addOutputOptions('-movflags +frag_keyframe+separate_moof+omit_tfhd_offset+empty_moov')
  .format('mp4')
  .pipe(writeStream);

La difficulté que j'avais rencontré était que mon flux n'était pas navigable dans le navigateur,
on ne pouvait revenir en arrière ni avancé, (un peut comme un flux en live sur twitch par exemple),
le navigateur ne s'avait pas comment naviguer dans la ressource, après avoir cherché un peut je me suis rendu compte que ça venait de certains en-tête HTTP qu'il fallait définir (Accept-Ranges, Range).
J'avais posté un sujet pour qu'on m'aide à régler ce problème, la personne qui ma aider a trouvé un article assez explicite sur ce sujet là.