I'm working on a simple two-way communication website. It uses Peer.js for peer-to-peer browser communication. I've taken a lot of the code from this demo: https://jmcker.github.io/Peer-to-Peer-Cue-System/ . The problem is, after I call sendMessage() to send data between the browsers, they get disconnected. The data is sent, I believe, but it is never received, as the connection is cut off as soon as I try to send it. Here's the code for the host device :
var peer;
var lastPeerId;
var conn;
function initialize() {
// Create own peer object with connection to shared PeerJS server
peer = new Peer(null, {
debug: 0
});
peer.on('open', function (id) {
// Workaround for peer.reconnect deleting previous id
if (peer.id === null) {
console.log('Received null id from peer open');
peer.id = lastPeerId;
} else {
lastPeerId = peer.id;
}
console.log("ID: " + peer.id);
console.log("Awaiting connection.")
});
peer.on('connection', function (c) {
// Allow only a single connection
if (conn) {
c.on('open', function () {
c.send("Already connected to another client");
setTimeout(function () {
c.close();
}, 500);
});
return;
}
conn = c;
console.log("Connected to: " + conn.peer);
ready();
});
peer.on('disconnected', function () {
console.log('Connection lost. Please reconnect');
// Workaround for peer.reconnect deleting previous id
peer.id = lastPeerId;
peer._lastServerId = lastPeerId;
peer.reconnect();
});
peer.on('close', function () {
conn = null;
console.log('Connection destroyed');
});
peer.on('error', function (err) {
console.log(err);
});
};
function ready() {
conn.on('data', function (data) {
console.log("Data recieved");
console.log("Received: " + data);
});
conn.on('close', function () {
console.log("Connection reset. Awaiting connection...");
conn = null;
//start(true);
});
}
function sendMessage(message) {
if (conn && conn.open) {
conn.send(message);
console.log("Sent: " + message);
} else {
console.log('Connection is closed');
}
}
initialize();
And this is the code for the connecting device (not the host) :
var peer;
var lastPeerId;
var conn;
//Get the ID specified in the address after the "?" sign
var idToConnectTo = window.location.href.split("?")[1];
function initialize() {
// Create own peer object with connection to shared PeerJS server
peer = new Peer(null, {
debug: 0
});
peer.on('open', function (id) {
// Workaround for peer.reconnect deleting previous id
if (peer.id === null) {
console.log('Received null id from peer open');
peer.id = lastPeerId;
} else {
lastPeerId = peer.id;
}
console.log('ID: ' + peer.id);
join();
});
peer.on('disconnected', function () {
console.log('Connection lost. Please reconnect');
// Workaround for peer.reconnect deleting previous id
peer.id = lastPeerId;
peer._lastServerId = lastPeerId;
peer.reconnect();
});
peer.on('close', function () {
conn = null;
console.log('Connection destroyed');
});
peer.on('error', function (err) {
console.log(err);
});
};
function join() {
// Close old connection
if (conn) {
conn.close();
}
// Create connection to destination peer specified in the input field
conn = peer.connect(idToConnectTo, {
reliable: true
});
conn.on('open', function () {
console.log("Connected to: " + conn.peer);
});
// Handle incoming data
conn.on('data', function (data) {
console.log("Received: " + data);
});
conn.on('close', function () {
console.log("Connection closed");
});
};
function sendMessage(message) {
if (conn && conn.open) {
conn.send(message);
console.log("Sent: " + message);
} else {
console.log('Connection is closed');
}
}
initialize();
Any help would be appreciated. Thanks!
I think the problem is that I was trying to communicate between two tabs of the same browser. When using two different browsers it worked correctly.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.