WebRT C RTCMultiConnection с использованием Socket IO - PullRequest
1 голос
/ 27 мая 2020

Я начал разработку WebRT C с сокетом io. Я следил за этим учебником . загрузил этот проект с GitHub, установил сокет io, выполнив следующие действия кнопка, кнопка отключается, но ничего не происходит, и в консоли также нет ошибок

WebRTC

index. html code:

<input type="text" id="broadcast-id" placeholder="broadcast-id" value="room-xyz">
<select id="broadcast-options">
    <option>Audio+Video</option>
    <option title="Works only in Firefox.">Audio+Screen</option>
    <option>Audio</option>
    <option>Video</option>
    <option title="Screen capturing requries HTTPs. Please run this demo on HTTPs to make sure it can capture your screens.">Screen</option>
</select>
<button id="open-or-join">Open or Join Broadcast</button>
<hr>
<div id="videos-container"></div>

<script src="http://10.0.0.***:3000/socket.io/socket.io.js"></script>
<script src="https://cdn.webrtc-experiment.com/RTCMultiConnection.js"></script>
<script>
    var socket = io.connect('http://10.0.0.***');

    // using single socket for RTCMultiConnection signaling
    var onMessageCallbacks = {};
    socket.on('message', function(data) {
        if (data.sender == connection.userid) return;
            if (onMessageCallbacks[data.channel]) {
                onMessageCallbacks[data.channel](data.message);
            };
        });

    // initializing RTCMultiConnection constructor.
    function initRTCMultiConnection(userid) {
        var connection = new RTCMultiConnection();
        connection.body = document.getElementById('videos-container');
        connection.channel = connection.sessionid = connection.userid = userid || connection.userid;
        connection.sdpConstraints.mandatory = {
            OfferToReceiveAudio: false,
            OfferToReceiveVideo: true
        };
        // using socket.io for signaling
        connection.openSignalingChannel = function(config) {
            var channel = config.channel || this.channel;
            onMessageCallbacks[channel] = config.onmessage;
            if (config.onopen) setTimeout(config.onopen, 1000);
            return {
                send: function(message) {
                    socket.emit('message', {
                        sender: connection.userid,
                        channel: channel,
                        message: message
                    });
                },
                channel: channel
           };
      };
      connection.onMediaError = function(error) {
          alert(JSON.stringify(error));
      };
      return connection;
 }

 // this RTCMultiConnection object is used to connect with existing users
 var connection = initRTCMultiConnection();

 connection.getExternalIceServers = false;

 connection.onstream = function(event) {
     connection.body.appendChild(event.mediaElement);

     if (connection.isInitiator == false && !connection.broadcastingConnection) {
          // "connection.broadcastingConnection" global-level object is used
          // instead of using a closure object, i.e. "privateConnection"
          // because sometimes out of browser-specific bugs, browser 
          // can emit "onaddstream" event even if remote user didn't attach any stream.
          // such bugs happen often in chrome.
          // "connection.broadcastingConnection" prevents multiple initializations.

          // if current user is broadcast viewer
          // he should create a separate RTCMultiConnection object as well.
          // because node.js server can allot him other viewers for
          // remote-stream-broadcasting.
          connection.broadcastingConnection = initRTCMultiConnection(connection.userid);

          // to fix unexpected chrome/firefox bugs out of sendrecv/sendonly/etc. issues.
          connection.broadcastingConnection.onstream = function() {};

          connection.broadcastingConnection.session = connection.session;
          connection.broadcastingConnection.attachStreams.push(event.stream); // broadcast remote stream
          connection.broadcastingConnection.dontCaptureUserMedia = true;

          // forwarder should always use this!
          connection.broadcastingConnection.sdpConstraints.mandatory = {
               OfferToReceiveVideo: false,
               OfferToReceiveAudio: false
          };

          connection.broadcastingConnection.open({
               dontTransmit: true
          });
      }
 };

 // ask node.js server to look for a broadcast
 // if broadcast is available, simply join it. i.e. "join-broadcaster" event should be emitted.    
 // if broadcast is absent, simply create it. i.e. "start-broadcasting" event should be fired.
 document.getElementById('open-or-join').onclick = function() {
       var broadcastid = document.getElementById('broadcast-id').value;
       if (broadcastid.replace(/^\s+|\s+$/g, '').length <= 0) {
            alert('Please enter broadcast-id');
            document.getElementById('broadcast-id').focus();
            return;
       }

       this.disabled = true;

       connection.session = {
            video: document.getElementById('broadcast-options').value.indexOf('Video') !== -1,
            screen: document.getElementById('broadcast-options').value.indexOf('Screen') !== -1,
            audio: document.getElementById('broadcast-options').value.indexOf('Audio') !== -1,
            oneway: true
      };

      socket.emit('join-broadcast', {
          broadcastid: broadcastid,
          userid: connection.userid,
          typeOfStreams: connection.session
      });
};

// this event is emitted when a broadcast is already created.
socket.on('join-broadcaster', function(broadcaster, typeOfStreams) {
    connection.session = typeOfStreams;
    connection.channel = connection.sessionid = broadcaster.userid;

    connection.sdpConstraints.mandatory = {
        OfferToReceiveVideo: !!connection.session.video,
        OfferToReceiveAudio: !!connection.session.audio
    };

    connection.join({
        sessionid: broadcaster.userid,
        userid: broadcaster.userid,
        extra: {},
        session: connection.session
    });
});

// this event is emitted when a broadcast is absent.
socket.on('start-broadcasting', function(typeOfStreams) {
     // host i.e. sender should always use this!
     connection.sdpConstraints.mandatory = {
          OfferToReceiveVideo: false,
          OfferToReceiveAudio: false
     };
     connection.session = typeOfStreams;
     connection.open({
         dontTransmit: true
     });

     if (connection.broadcastingConnection) {
         // if new person is given the initiation/host/moderation control
         connection.broadcastingConnection.close();
         connection.broadcastingConnection = null;
     }
});

window.onbeforeunload = function() {
     // Firefox is weird!
     document.getElementById('open-or-join').disabled = false;
};
</script>

Я новичок ie в этом, в чем может быть проблема?

1 Ответ

0 голосов
/ 13 июня 2020

Я сам какое-то время застревал в такой же ситуации go. Я хотел реализовать несколько похожий алгоритм, который сделал Муаз в своем репо git, но во многих местах я обнаружил, что это репо Муаза сейчас не поддерживается и устарело, и мне пришлось начинать с нуля. Поэтому я просто последовал примеру Шейна Талли на webRT C и начал кодировать свой алгоритм поверх него. Поток ретранслируется через клиентов, как в алгоритме муаза, но алгоритм модифицирован для формирования торрент-цепочки. Реализованный алгоритм: здесь (git репо) - , а алгоритм показан на рисунке

Клиенты с высокой и низкой пропускной способностью фильтруются так, что только Клиенты с высокой пропускной способностью действуют как перенаправители потоков. Он отлично работает в локальной сети, а на inte rnet ему есть что улучшить.

...