Question

我正在开展一个小型的PeerJS项目，我有点困惑。我能够打开一个连接并确认客户端是连接的，但我无法找出接收任何东西的正确方法或语法。或许我只是遗漏了一些简单的东西。我尝试了很多变种试图让它发挥作用。下面是JS和HTML。

JS：

var peer = new Peer({
  key: 'lwjd5qra8257b9'
// I use my own API key for testing, this is the public PeerJS key
//you'll have to generate your own if this doesn't work.
});

peer.on('open', function(id) {
  $('body').append('<br/>Your personal peer ID is: ' + id + '<br/>Be careful who you share it with.');
});
peer.on('connection', connect);

function connect(succ) {
  conn = succ;
  //input changes on successful connect
  $('#peerKeyEnter').val(conn.peer);
  $('#peerKeyEnter').prop('disabled',true);
}

$(document).ready(function() {

  $('#peerKeySubmit').on('click', function() {
    var buddy = document.getElementById('peerKeyEnter').value;
    var buddyConn = peer.connect(buddy); //send connection request
    connect(buddyConn); //connect to peer

    //sending data
    buddyConn.on('open', function() {
      buddyConn.send('this is supposed to work')
    });

    //receiving data
    buddyConn.on('connection', function(conn) {
      buddyConn.on('data', function(data) {
        console.log(data);
      });
    });
  }); //end peerKeySubmit.click
}); //end doc.ready()

HTML：

<html>
<head>
  <script
  src="https://code.jquery.com/jquery-3.2.1.js"
  integrity="sha256-DZAnKJ/6XZ9si04Hgrsxu/8s717jcIzLy3oi35EouyE="
  crossorigin="anonymous"></script>
  <!--script src='peer.js'></script-->
<script src="http://cdn.peerjs.com/0.3/peer.js"></script>
  <script src='app.js'></script>
</head>
<body>

<input type='text' id='peerKeyEnter' placeholder="Enter peer's ID"></input>
<button id='peerKeySubmit' value='Send'>Select Peer</button>

</body>
</html>

Answer 1

实际上，你几乎就在那里。您的buddyConn.on('data'...应该在connect函数中，使用该函数的连接参数名称。此外，对connect的第二次调用不应该在#peerKeySubmit.on回调函数中。这是修改后的（工作）代码：

var peer = new Peer({
  key: 'lwjd5qra8257b9'
// I use my own API key for testing, this is the public PeerJS key
//you'll have to generate your own if this doesn't work.
});

peer.on('open', function(id) {
  $('body').append('<br/>Your personal peer ID is: ' + id + '<br/>Be careful who you share it with.');
});
peer.on('connection', connect);

function connect(succ) {
  conn = succ;
  conn.on('data', function (data) {
    console.log('Received from ' + conn.peer + ': ' + data);
  });

  //input changes on successful connect
  $('#peerKeyEnter').val(conn.peer);
  $('#peerKeyEnter').prop('disabled',true);
}

$(document).ready(function() {

  $('#peerKeySubmit').on('click', function() {
    var buddy = document.getElementById('peerKeyEnter').value;
    var buddyConn = peer.connect(buddy); //send connection request

    //sending data
    buddyConn.on('open', function() {
      buddyConn.send('this is supposed to work')
    });

  }); //end peerKeySubmit.click
}); //end doc.ready()

通过PeerJS接收数据

1 个答案: