PeerJS text chat

Question

I am currently writing a web based chat client where two people connect to each other randomly and are thrown into the chat together with no prompting.

I am using the PeerJS library since I found it to be the most understandable one for me. I am at a blocking point though: I am not sure how to actually implement the text chat.

I have looked at their example on their site (here) and I have modified the code slightly to work for me (mostly just how it looks and what some of the output is).

A problem I encountered is that their code requires two people to enter the other's id manually and the chat won't start without both people's verification (meaning, they both have to enter the id and press a "Connect" button).

Below is some code I have ran through my head to try to work out:

First I have to listen for the connection with PeerJS:

myPeer.on("connection", function() {...});

But at the same time, I want to listen for opening a connection on the same client, since I don't want to have to prompt the users for each other's ids:

myConn.on("open", function() {...})

But this is not possible (as far as I know) since I can't know what myConn will be until I open a connection with the myPeer listener above.

My problem is that I don't know how to do those simultaneously. If it helps at all, I am attempting to do video chat alongside this, which I have all figured out so if I could somehow piggyback off of that connection or whatever, that works too. I have total control over the project so I can pretty much do whatever I want (including switch libraries, if one is either easier to use or more developed).

Answer 1

the connection event gives you a DataConnection instance.

Consider the following code on the receiving end:

var peer = new Peer('clientID');
peer.on('connection', function(con){
    con.on('data', function(data){
        console.log('Incoming data', data);
        con.send('REPLY');
    });
});

Now use this code on the sending end:

var peer = new Peer();
var con = peer.connect('clientID');
con.on('data', function(data){ ... });
con.send('HELLO WORLD');

Its important to wait for the connections to be open before sending messages. For the above you could use the con.on('open', function(){ ... });

DataConnections behave similar to TCP sockets. If you want two-way communication you can use 2 sockets from 2 peers. Since this question is a couple of months old I'm leaving the double socket solution for now. Let me know if you still need it.

Answer 2

According to their documentation, there is no way of connecting to a peer without knowing its ID As they mentioned here https://peerjs.com/docs.html#start When we want to connect to another peer, we'll need to know their peer id. You're in charge of communicating the peer IDs between users of your site.

I suggest you to use socket.io (or another instant data transfer means you prefer) for communicating these IDs

var peer = new Peer();
peer.on('open', function(id) {
  console.log('My peer ID is: ' + id); //this will show you your ID
});

//then to connect to another peer
var conn = peer.connect('destination-peer-id'); //here you will use the destination peer that you have received using socket.io or another instant data transfer means you prefer