web-dev-qa-db-fra.com

Flux vidéo en direct sur un serveur Node.js

J'ai fait beaucoup de recherches à ce sujet, mais je suis frustré car j'estime que la solution devrait être aussi simple que je sache, ne le sera pas. Idéalement, je voudrais juste utiliser un noeud pour héberger le serveur, nous devrions obtenir le flux en direct sur le client local et utiliser quelque chose comme socket.io pour envoyer le flux au serveur, puis le serveur diffusera le flux sur le serveur distant. client; comme s'il s'agissait d'une simple application de messagerie instantanée.

En y réfléchissant un peu plus, il semble qu'une approche aussi simple serait impossible car une vidéo en direct nécessite l'envoi continu de grandes quantités de données, ce qui ne revient pas à envoyer un seul message ou même un fichier après un événement (bouton d'envoi enfoncé) .

Peut-être que je me trompe cependant, une application de flux vidéo en direct peut-elle suivre la même structure qu'une application de messager noeud/socket.io? Souhaitez-vous envoyer l'objet multimédia renvoyé par getUserMedia, le blob, certaines données binaires, d'une certaine manière (j'ai essayé toutes ces solutions mais peut-être pas correctement).

L’objectif idéal serait une application qui utilise aussi peu que extra fluff autant de fois que nécessaire, peu d’installations npm, peu de bibliothèques javascript supplémentaires, ou peu soucieuse de coder/décoder ou peu importe ce que l’enfer ICE ou STUN sont. Est-il possible que ce soit possible ou est-ce que j'en demande trop?

Client idéal 

    var socket = io();
    var local = document.getElementById("local_video");
    var remote = document.getElementById("remote_video");

    // display local video
    navigator.mediaDevices.getUserMedia({video: true, audio: true}).then(function(stream) {
      local.src = window.URL.createObjectURL(stream);
      socket.emit("stream", stream);
    }).catch(function(err){console.log(err);});

    // displays remote video
    socket.on("stream", function(stream){
      remote.src = window.URL.createObjectURL(stream);

    });

Serveur idéal 

var app = require("express")();
var http = require("http").Server(app);
var fs = require("fs");
var io = require("socket.io")(http);

app.get('/', onRequest);
http.listen(process.env.PORT || 3000, function() {
    console.log('server started');
})

//404 response
function send404(response) {
    response.writeHead(404, {"Content-Type" : "text/plain"});
    response.write("Error 404: Page not found");
    response.end();
}

function onRequest(request, response) {
  if(request.method == 'GET' && request.url == '/') {
    response.writeHead(200, {"Content-Type" : "text/html"});
    fs.createReadStream("./index.html").pipe(response);
  } else {
    send404(response);
  }
}

io.on('connection', function(socket) {
  console.log("a user connected");
  socket.on('stream', function(stream) {
    socket.broadcast.emit("stream", stream);
  });
  socket.on('disconnect', function () {
    console.log("user disconnected");
  });
});

Ceci est l'application cassée en action: https://nodejs-videochat.herokuapp.com/

C'est le code cassé sur github: https://github.com/joshydotpoo/nodejs-videochat

javascriptnode.jssocket.iowebrtclive-streaming
24
joshy.poo

Essayez d'être clair et précis. Tout d’abord, vous n’utilisez pas WebRTC ici. getUserMedia () fait partie de navigateur WebAPI que vous utilisez pour obtenir un flux multimédia de la caméra.

L'utilisation de WebRTC signifie que vous utilisez des serveurs ICE et STUN/TURN à des fins de signalisation. Vous utiliserez votre serveur hôte pour spécifier la configuration ICE, identifier chaque utilisateur et fournir un moyen de s'appeler.

Si vous souhaitez le diffuser via votre hôte, vous devriez probablement le diffuser en morceaux et configurer votre propre infrastructure de signalisation. Vous pouvez utiliser Stream API avec socket io pour diffuser des données en morceaux (paquets). Voir ici Stream API (socket.io)

Vous pouvez également consulter l’exemple en direct de WebRTC + Socket.io ici: Socket.io | WebRTC Video Chat

Vous pouvez trouver plus d'informations ici: envoi d'un flux multimédia au serveur hôte

16
Gaurav Chaudhary