javascript 如何启用PeerJS连接和共享数据

vxf3dgd4  于 2023-10-14  发布在  Java
关注(0)|答案(1)|浏览(223)

我正在尝试建立一个peerjs连接,并在连接之间建立聊天。
我能够获得连接ID,但我的代码既没有建立连接,也没有在设备之间发送一些文本。
帮助我正确的方式来连接同行。

let peer = new Peer();
let peerConnection;

// Generate Peer ID
peer.on('open', function (id) {
  div.innerHTML = `My peer ID is:  ${id}`;
});

// Function to connect with other Peer
function connect() {
  const idClient = document.getElementById("id").value;
  peerConnection = peer.connect(idClient);

  // On open will be launched when you successfully connect to
  peerConnection.on('open', function () {
    // Here you have conn.id
    peerConnection.send("hi!");
  });
}

// Receive message from other Peer
peer.on('connection', function (peerConnection) {
  peerConnection.on('data', function (data) {
    alert(data);
    // Will print "hi!"
  });
});

// Function to send message
function send() {
  if (!peerConnection.open) {
    alert("Peer connection is not open.");
    return;
  }
  const msg = document.getElementById("msg").value;
  peerConnection.send(msg);
}

// Function to disconnect from the other peer
function disconnect() {
  peerConnection.close();
}
body {
  font-family: Consolas, "Courier New", Courier, monospace;
}
<head>
 <title>Messaging System</title>
 <script src="https://unpkg.com/[email protected]/dist/peerjs.min.js"></script>
</head>
<body>
 <div id="div"></div>
 <input id="id" placeholder="Peer ID" />
 <button onclick="connect()">Connect</button>
 <textarea id="msg" placeholder="Type your message here"></textarea>
 <button onclick="send()">Send</button>
 <button onclick="disconnect()">Disconnect</button>
</body>
1tuwyuhd

1tuwyuhd1#

哦!代码运行得很流畅。我最初使用alert()来显示消息,但没有显示。我已经更新了我的代码,将alert()替换为console.log(),现在可以工作了。

let peer = new Peer();
let peerConnection;

// Generate Peer ID
peer.on('open', function (id) {
  div.innerHTML = `My peer ID is:  ${id}`;
});

// Function to connect with other Peer
function connect() {
  const idClient = document.getElementById("id").value;
  peerConnection = peer.connect(idClient);

  // On open will be launched when you successfully connect to
  peerConnection.on('open', function () {
    // Here you have conn.id
    peerConnection.send("hi!");
  });
}

// Receive message from other Peer
peer.on('connection', function (peerConnection) {
  peerConnection.on('data', function (data) {
    console.log(data);
    // Will print "hi!"
  });
});

// Function to send message
function send() {
  if (!peerConnection.open) {
    console.log("Peer connection is not open.");
    return;
  }
  const msg = document.getElementById("msg").value;
  peerConnection.send(msg);
}

// Function to disconnect from the other peer
function disconnect() {
  peerConnection.close();
}
body {
  font-family: Consolas, "Courier New", Courier, monospace;
}
<head>
 <title>Messaging System</title>
 <script src="https://unpkg.com/[email protected]/dist/peerjs.min.js"></script>
</head>
<body>
 <div id="div"></div>
 <input id="id" placeholder="Peer ID" />
 <button onclick="connect()">Connect</button>
 <textarea id="msg" placeholder="Type your message here"></textarea>
 <button onclick="send()">Send</button>
 <button onclick="disconnect()">Disconnect</button>
</body>

相关问题