CODEWITHSUNDEEP
javascriptwebrtcvideo-streamingpeer-connection
Mahdi
Mahdi

Reputation: 65

How to share local video file's stream using Webrtc

i tried to share local video file's stream in webrtc. it was successful in tomcat localhost but fails on running in website. just when i share navigator.mediaDevices's stream it works every where but sharing video file's stream works only in localhost.

var video = document.getElementById('myVideo');
var stream;
var rTCPeerConnection;

 /*
  stream = await navigator.mediaDevices.getUserMedia({
            audio: true,
            video: true
            });
 */
  
 video.onloadeddata = function(){
    if ($.browser.mozilla){
            stream = this.mozCaptureStream();
                }else{  
            stream = this.captureStream();
                }
    }
    
     video.src= "./myfile.webm";

function share_stream_to_peerConnection(){
    stream.getTracks().forEach(track =>  rTCPeerConnection.addTrack(track, stream)  );
}

Upvotes: 0

Views: 1048

Answers (2)

Hithesh Jay
Hithesh Jay

Reputation: 31

This doesn't work on website but works on localhost is because for WebRTC to communicate via internet you need a STUN/TURN server. Because when you're communicating through internet there are firewalls and NAT's restricting your way. So in order to bypass them you need a STUN/TURN server. Read more about these from here. https://github.com/borjanebbal/webrtc-node-app

Upvotes: 0

Hard Monkey PC
Hard Monkey PC

Reputation: 63

this is a simple example i made to share file through webRTC, here you can see how webRTC data flow works. I used a websocket to handle the message between 2 users. Maybe can be helpfull.

https://bit.cloud/intershare/galacfetch/hooks/web-rtc-local-share/~code/src/web-rtc-local-share.ts

// and here  an example of the  websocket in the backend side.
  let connectedClients = [];

  io.on('connection', function (socket) {
    // connected user
    connectedClients.push(socket.id);
    socket.on('disconnect', () => {
      const index = connectedClients.indexOf(socket.id);
      if (index > -1) {
        connectedClients.splice(index, 1);
      }
    });

    // Manejar oferta SDP
    socket.on('offer', (offer) => {
      const randomClients = getRandomClients(10, socket.id, connectedClients);
      if (randomClients.includes(socket.id)) {
        randomClients.forEach((clientId) => {
          socket.to(clientId).emit('offer', offer, socket.id);
        });
      }
    });

    // Manejar respuesta SDP
    socket.on('answer', (answer) => {
      const randomClients = getRandomClients(10, socket.id);
      if (randomClients.includes(socket.id)) {
        randomClients.forEach((clientId) => {
          socket.to(clientId).emit('answer', answer);
        });
      }
    });

    // Manejar ICE candidates
    socket.on('ice-candidate', (iceCandidate) => {
      const randomClients = getRandomClients(10, socket.id);
      if (randomClients.includes(socket.id)) {
        randomClients.forEach((clientId) => {
          socket.to(clientId).emit('ice-candidate', iceCandidate);
        });
      }
    });
  });

Upvotes: 0

Related Questions