Question

我正在进行视频会议项目，用户可以通过文字和视频在线聊天。文本在两个特定用户之间交换，但视频正在播放。视频和音频应该传输给特定用户。请帮我解决这个问题。我正在附上这个项目。我已经完成了 visual studio 2010和webrtc 。网络表单是视频提前谢谢。

var socket = new WebSocket('ws://Video.com:1337/');  // change the IP address to your websocket server
  var stunServer = "stun.l.google.com:19302";
  var sourcevid = document.getElementById('sourcevid');
  var remotevid = document.getElementById('remotevid');
  var localStream = null;
  var remoteStream;
  var peerConn = null;
  var started = false;
  var isRTCPeerConnection = true;
  var mediaConstraints = { 'mandatory': {
      'OfferToReceiveAudio': true,
      'OfferToReceiveVideo': true
  }
  };

  var logg = function (s) { console.log(s); };

  //for text chat
  var chatInput;
  var chatArea;
  var chatNick;
  var chatoNick;
  var chatFrameObj;
  myMid = Math.floor(Math.random() * 100000);
  myMid = "'" + myMid + "'";
  chatInput = document.getElementById("chatInputText");
  chatNick = document.getElementById("chatNick");
  chatoNick = document.getElementById("chatoNick");
  chatFrameObj = document.getElementById("chatFrame");
  chatNick.value = myMid;


  // send the message to websocket server
  function sendMessage(message) {
      var mymsg = JSON.stringify(message);
      logg("SEND: " + mymsg);
      socket.send(mymsg);
  }

  function createPeerConnection() {
      try {
          logg("Creating peer connection");
          var servers = [];
          servers.push({ 'url': 'stun:' + stunServer });
          var pc_config = { 'iceServers': servers };
          peerConn = new webkitRTCPeerConnection(pc_config);
          peerConn.onicecandidate = onIceCandidate;
      } catch (e) {
          try {
              peerConn = new RTCPeerConnection('STUN ' + stunServer, onIceCandidate00);
              isRTCPeerConnection = false;
          } catch (e) {
              logg("Failed to create PeerConnection, exception: " + e.message);
          }
      }

      peerConn.onaddstream = onRemoteStreamAdded;
      peerConn.onremovestream = onRemoteStreamRemoved;
  }

  // when remote adds a stream, hand it on to the local video element
  function onRemoteStreamAdded(event) {
      logg("Added remote stream");
      remotevid.src = window.webkitURL.createObjectURL(event.stream);
  }

  function waitForRemoteVideo() {
      if (remoteStream.videoTracks.length === 0 || remotevid.currentTime > 0) {
          transitionToActive();
      } else {
          setTimeout(waitForRemoteVideo, 100);
      }
  }

  function transitionToActive() {
      remotevid.style.opacity = 1;
      card.style.webkitTransform = "rotateY(180deg)";
      setTimeout(function () { sourcevid.src = ""; }, 500);
      setStatus("<input type=\"button\" id=\"hangup\" value=\"Hang up\" onclick=\"onHangup()\" />");
  }

  // when remote removes a stream, remove it from the local video element
  function onRemoteStreamRemoved(event) {
      logg("Remove remote stream");
      remotevid.src = "";
  }

  function onIceCandidate(event) {
      if (event.candidate) {
          sendMessage({ type: 'candidate',
              label: event.candidate.sdpMLineIndex,
              id: event.candidate.sdpMid,
              candidate: event.candidate.candidate, mid: myMid, nick: chatNick.value, tonick: chatoNick.value
          });
      } else {
          logg("End of candidates.");
      }
  }

  function onIceCandidate00(candidate, moreToFollow) {
      if (candidate) {
          sendMessage({ type: 'candidate', label: candidate.label, candidate: candidate.toSdp(), mid: myMid, nick: chatNick.value, tonick: chatoNick.value });
      }
      if (!moreToFollow) {
          logg("End of candidates.");
      }
  }

  // start the connection upon user request
  function connect() {
      if (!started && localStream)
      {
          document.getElementById('anim').style.visibility = 'visible';
          console.log("Creating PeerConnection.");
          createPeerConnection();
          logg('Adding local stream...');
          peerConn.addStream(localStream);
          started = true;
          logg("isRTCPeerConnection: " + isRTCPeerConnection);

          //create offer
          if (isRTCPeerConnection) {
              peerConn.createOffer(setLocalAndSendMessage, null, mediaConstraints);
          } else {
              var offer = peerConn.createOffer(mediaConstraints);
              peerConn.setLocalDescription(peerConn.SDP_OFFER, offer);
              sendMessage({ type: 'offer', sdp: offer.toSdp() });
              peerConn.startIce();
          }
          // __doPost('btnconnect', 'OnClick');
          document.getElementById('<%=btnconnect.ClientID%>').fireEvent("onclick");
      } else {
          alert("Local stream not running yet.");
      }
  }

  // accept connection request
  socket.addEventListener("message", onMessage, false);
  function onMessage(evt) {
      logg("RECEIVED: " + evt.data);
      if (isRTCPeerConnection)
          processSignalingMessage(evt.data);
      else
          processSignalingMessage00(evt.data);
  }

  function processSignalingMessage(message) {
      var msg = JSON.parse(message);

      if (msg.type === 'offer') {

          if (!started && localStream) {
              createPeerConnection();
              logg('Adding local stream...');
              peerConn.addStream(localStream);
              started = true;
              logg("isRTCPeerConnection: " + isRTCPeerConnection);


              if (isRTCPeerConnection) {
                  //set remote description
                  peerConn.setRemoteDescription(new RTCSessionDescription(msg));
                  //create answer
                  console.log("Sending answer to peer.");
                  peerConn.createAnswer(setLocalAndSendMessage, null, mediaConstraints);
              } else {
                  //set remote description
                  peerConn.setRemoteDescription(peerConn.SDP_OFFER, new SessionDescription(msg.sdp));
                  //create answer
                  var offer = peerConn.remoteDescription;
                  var answer = peerConn.createAnswer(offer.toSdp(), mediaConstraints);
                  console.log("Sending answer to peer.");
                  setLocalAndSendMessage00(answer);
              }
          }

      } else if (msg.type === 'answer' && started) {
          peerConn.setRemoteDescription(new RTCSessionDescription(msg));
      } else if (msg.type === 'candidate' && started) {
          var candidate = new RTCIceCandidate({ sdpMLineIndex: msg.label, candidate: msg.candidate });
          peerConn.addIceCandidate(candidate);
      } else if ((msg.type == 'chat') && ((msg.tonick == chatNick.value) || (msg.tonick == ''))) {
          addChatMsg(msg.nick, msg.cid, msg.data);
      }
      else if (msg.type === 'bye' && started) {
          onRemoteHangUp();
      }
  }

  function processSignalingMessage00(message) {
      var msg = JSON.parse(message);

      // if (msg.type === 'offer')  --> will never happened since isRTCPeerConnection=true initially
      if (msg.type === 'answer' && started) {
          peerConn.setRemoteDescription(peerConn.SDP_ANSWER, new SessionDescription(msg.sdp));
      } else if (msg.type === 'candidate' && started) {
          var candidate = new IceCandidate(msg.label, msg.candidate);
          peerConn.processIceMessage(candidate);
      } else if (msg.type === 'bye' && started) {
          onRemoteHangUp();
      }
  }

  function setLocalAndSendMessage(sessionDescription) {
      peerConn.setLocalDescription(sessionDescription);
      sendMessage(sessionDescription);
  }

  function setLocalAndSendMessage00(answer) {
      peerConn.setLocalDescription(peerConn.SDP_ANSWER, answer);
      sendMessage({ type: 'answer', sdp: answer.toSdp() });
      peerConn.startIce();
  }

  function onRemoteHangUp() {
      logg("Remote Hang up.");
      closeSession();
  }

  function onHangUp() {
      logg("Hang up.");
      document.getElementById('anim').style.visibility = 'hidden';
      if (started) {
          sendMessage({ type: 'bye' });
          closeSession();
          __doPost('btnhangup', 'OnClick');
      }
  }

  function closeSession() {
      peerConn.close();
      peerConn = null;
      started = false;
      remotevid.src = "";
  }

  window.onbeforeunload = function () {
      if (started) {
          sendMessage({ type: 'bye' });
      }
  }

  function startVideo()
  {
      // Replace the source of the video element with the stream from the camera
      try 
      {
          navigator.webkitGetUserMedia({ audio: true, video: true }, successCallback, errorCallback);
      }
      catch (e) 
      {
          navigator.webkitGetUserMedia("video,audio", successCallback, errorCallback);
      }
      function successCallback(stream) 
      {
          sourcevid.src = window.webkitURL.createObjectURL(stream);
          sourcevid.style.webkitTransform = "rotateY(180deg)";
          localStream = stream;
      }
      function errorCallback(error) 
      {
          logg('An error occurred: [CODE ' + error.code + ']');
      }
  }

  function stopVideo() {
      sourcevid.src = "";
  }

  function sendChatMsg()
  {
      var classIdx = myMid.substr(myMid.length - 1, 1);
      if (window.event.keyCode == 13) {
          if (chatInput.value.length < 1) {
              return;
          }
          console.log("msg will be sent -> " + chatInput.value);
          addChatMsg("Me", classIdx, chatInput.value);
          sendMessage({ type: "chat", data: chatInput.value, mid: myMid, nick: chatNick.value, tonick: chatoNick.value, cid: classIdx });

         //chatInput.value = '';
      }
  }

  function addChatMsg(id, classIdx, msg) {
      var msgP = document.createElement("span");
      var idSpan = document.createElement("span");
      idSpan.className = "member" + classIdx;
      idSpan.innerText = id;
      var msgSpan = document.createElement("span");
      msgSpan.innerText = msg + "\r\n";
      var delimSpan = document.createElement("span");
      delimSpan.innerText = " : ";
      msgP.appendChild(idSpan);
      msgP.appendChild(delimSpan);
      msgP.appendChild(msgSpan);
      chatFrame.document.body.appendChild(msgP);
      chatFrame.document.body.scrollTop = 999999;
  }

Answer 1

请检查您的浏览器是否启用了webrtc。如果您使用chrome，则可以通过以下方式启用webrtc。打开chrome，导航到chrome：// flags并启用如下所示的选项。 enter image description here

视频会议通过webrtc

1 个答案: