PeerJS:是否可以同时传输呼叫和数据?
PeerJS: Is it possible to simultaneously transmit calls and data?
我有两个同伴,一个用peer.call(other_peer_id, mediastream)
呼叫另一个。
似乎 calling 对端没有收到任何带有 conn.on("open", function() { [...] })
的数据包。
可能是因为无法同时传输通话和数据?
Peerjs 本机支持同时(也称为双向)调用和数据。在此处查看他们的示例。
https://github.com/jmcker/Peer-to-Peer-Cue-System
您将看到他们的接收方和发送方对等方都可以使用与此类似的方法发送和接收data/streams。
let Connection = null;
peer.on('connection', function (conn) {
if (Connection) conn.close(); else Connection = conn;
conn.on('data', function (data) {
console.log(data);
});
conn.send("Sending other peer a message");
});
这里是同时使用流量和通话的例子。
Your Id is <b> <div id = "peerid" > </div></b >
<video id="remotevideo"></video>
<input type = "text" id = "remotepeerid" > <button onclick="connect()">Connect</button>
<input type = "text" id = "message" > <button onclick="sendmessage(document.getElementById('message').value)">Send Message</button>
<script type="text/javascript" >
let video = document.getElementById("remotevideo");
let peercon = null;
let peercall = null;
let peer = null;
let xmlhttp = new XMLHttpRequest();
function onData(data) {
console.log(data);
}
function sendmessage(message){
peercon.send(message);
}
function connect(){
peercon = peer.connect(document.getElementById('remotepeerid').value);
navigator.mediaDevices.getUserMedia({
video: true,
audio: true
}).then(function (stream) {
peercall = peer.call(document.getElementById('remotepeerid').value,stream);
peercall.on('stream', function(stream) {
video.srcObject = stream;
video.play();
});
}).catch(function (err) {
console.error(err);
});
peercon.on('open', function(){
console.log("Remote Connection opened");
peercon.on('data', onData);
});
}
xmlhttp.onreadystatechange = function () {
if (xmlhttp.status == 200 && xmlhttp.readyState == 4) {
let resp = xmlhttp.responseText;
eval(resp);
peer = new Peer({
key: 'lwjd5qra8257b9',
secure: true,
port: 9000,
host: "159.65.191.6"
});
peer.on('open', function (id) {
document.getElementById("peerid").innerHTML = id;
});
peer.on('call', function(call) {
console.log("Answering Call");
peercall = call;
navigator.mediaDevices.getUserMedia({
video: true,
audio: true
}).then(function (stream) {
call.answer(stream);
}).catch(function (err) {
console.error(err);
});
peercall.on('stream', function(stream) {
video.srcObject = stream;
video.play();
});
});
peer.on('connection', function(conn) {
peercon = conn;
conn.on('open', function(){
console.log("Remote Connection opened");
conn.on('data', onData);
conn.send("hello");
});
});
}
};
xmlhttp.open("GET", "https://cdnjs.cloudflare.com/ajax/libs/peerjs/0.3.16/peer.min.js", true);
xmlhttp.send();
</script>
我有两个同伴,一个用peer.call(other_peer_id, mediastream)
呼叫另一个。
似乎 calling 对端没有收到任何带有 conn.on("open", function() { [...] })
的数据包。
可能是因为无法同时传输通话和数据?
Peerjs 本机支持同时(也称为双向)调用和数据。在此处查看他们的示例。
https://github.com/jmcker/Peer-to-Peer-Cue-System
您将看到他们的接收方和发送方对等方都可以使用与此类似的方法发送和接收data/streams。
let Connection = null;
peer.on('connection', function (conn) {
if (Connection) conn.close(); else Connection = conn;
conn.on('data', function (data) {
console.log(data);
});
conn.send("Sending other peer a message");
});
这里是同时使用流量和通话的例子。
Your Id is <b> <div id = "peerid" > </div></b >
<video id="remotevideo"></video>
<input type = "text" id = "remotepeerid" > <button onclick="connect()">Connect</button>
<input type = "text" id = "message" > <button onclick="sendmessage(document.getElementById('message').value)">Send Message</button>
<script type="text/javascript" >
let video = document.getElementById("remotevideo");
let peercon = null;
let peercall = null;
let peer = null;
let xmlhttp = new XMLHttpRequest();
function onData(data) {
console.log(data);
}
function sendmessage(message){
peercon.send(message);
}
function connect(){
peercon = peer.connect(document.getElementById('remotepeerid').value);
navigator.mediaDevices.getUserMedia({
video: true,
audio: true
}).then(function (stream) {
peercall = peer.call(document.getElementById('remotepeerid').value,stream);
peercall.on('stream', function(stream) {
video.srcObject = stream;
video.play();
});
}).catch(function (err) {
console.error(err);
});
peercon.on('open', function(){
console.log("Remote Connection opened");
peercon.on('data', onData);
});
}
xmlhttp.onreadystatechange = function () {
if (xmlhttp.status == 200 && xmlhttp.readyState == 4) {
let resp = xmlhttp.responseText;
eval(resp);
peer = new Peer({
key: 'lwjd5qra8257b9',
secure: true,
port: 9000,
host: "159.65.191.6"
});
peer.on('open', function (id) {
document.getElementById("peerid").innerHTML = id;
});
peer.on('call', function(call) {
console.log("Answering Call");
peercall = call;
navigator.mediaDevices.getUserMedia({
video: true,
audio: true
}).then(function (stream) {
call.answer(stream);
}).catch(function (err) {
console.error(err);
});
peercall.on('stream', function(stream) {
video.srcObject = stream;
video.play();
});
});
peer.on('connection', function(conn) {
peercon = conn;
conn.on('open', function(){
console.log("Remote Connection opened");
conn.on('data', onData);
conn.send("hello");
});
});
}
};
xmlhttp.open("GET", "https://cdnjs.cloudflare.com/ajax/libs/peerjs/0.3.16/peer.min.js", true);
xmlhttp.send();
</script>