Question

我正在使用peer.js创建一个webapp。这是一个应用程序，您可以通过网络摄像头看到彼此，只需通过服务器从peer.js提交来自其他人的ID。

它工作得很好，但我希望能够将变量发送给其他人。我想要这个的原因是因为我想创建一个按钮，无论何时按下它，另一个人都会听到声音。

喜欢：

$('.button').click(function()
{
   var clicked = true;
   //send var clicked to the other person so I can use an if statement there
}

我有两个问题。我不知道如何通过对等服务器将此变量发送给另一个人，并且由jquery完成，所以我不确定是否可以将该变量用作javascript代码的全局变量。

  <script>
    $( document ).ready(function() {
      $('.controls').hide();
      $('.bovenlijst').hide();
      $('.fotomaken').hide();
    });
    // Compatibility shim
    navigator.getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia || navigator.mozGetUserMedia;

    // PeerJS object
    var peer = new Peer({ key: 'lwjd5qra8257b9', debug: 3, config: {'iceServers': [
      { url: 'stun:stun.l.google.com:19302' } // Pass in optional STUN and TURN server for maximum network compatibility
    ]}});


    peer.on('open', function(){
      $('#my-id').text(peer.id);
      console.log(peer.id);
    });

    // Receiving a call
    peer.on('call', function(call){
      // Answer the call automatically (instead of prompting user) for demo purposes
      call.answer(window.localStream);
      step3(call);
    });
    peer.on('error', function(err){
      alert(err.message);
      // Return to step 2 if error occurs
      step2();
    });

    // Click handlers setup
    $(function(){
      $('#make-call').click(function(){
        // Initiate a call!
        var call = peer.call($('#callto-id').val(), window.localStream);
        $('#step2').hide();
        $('.controls').show();
        $('.bovenlijst').show();
        $('.fotomaken').show();
        step3(call);

      });

      $('#end-call').click(function(){
        window.existingCall.close();
        step2();
      });

      // Retry if getUserMedia fails
      $('#step1-retry').click(function(){
        $('#step1-error').hide();
        step1();
      });

      // Get things started
      step1();
    });

    function step1 () {
      // Get audio/video stream
      navigator.getUserMedia({audio: true, video: true}, function(stream){
        // Set your video displays
        $('#my-video').prop('src', URL.createObjectURL(stream));

        window.localStream = stream;
        step2();
      }, function(){ $('#step1-error').show(); });
    }

    function step2 () {
      $('#step1, #step3').hide();
      $('#step2').show();
    }

    function step3 (call) {
      // Hang up on an existing call if present
      if (window.existingCall) {
        window.existingCall.close();
      }

      // Wait for stream on the call, then set peer video display
      call.on('stream', function(stream){
        $('#their-video').prop('src', URL.createObjectURL(stream));
      });

      // UI stuff
      window.existingCall = call;
      $('#their-id').text(call.peer);
      call.on('close', step2);
      $('#step1, #step2').hide();
      $('#step3').show();
    }

  </script>

Answer 1

您需要做的就是在媒体连接上另外打开与其他对等方的数据连接。这样，您就可以在客户端之间传递变量等数据。此功能包含在PeerJS中。

从使用变量扩展的文档：

连接：

var myVariable = 'this is a test';
var conn = peer.connect('another-peers-id');
conn.on('open', function(){
  conn.send(myVariable);
});

接收

peer.on('connection', function(conn) {
  conn.on('data', function(data){
    // Will print 'this is a test'
    console.log(data);
  });
});

另见http://peerjs.com/

通过peer.js发送变量

1 个答案: