I am experimenting with WebRTC, simply building chat on a data channel. I have a problem that the chat works when both peers are connected on the same local network. Where peers try to connect from different networks (I have been testing this with 2 computers one connected to my home Internet network and the other one via my phone wifi router).
The behavior of chat seems to be fine, offer and answer are sent correctly via signaling server. And with the same signaling server the ice candidate is sent as well.
peer.onicecandidate = (iceEvent: RTCPeerConnectionIceEvent) => {
if (iceEvent.candidate) {
const message: ConnectionEvent = {
type: ConnectionEventType.CANDIDATE,
caller: null,
callee: event.caller,
room: event.room,
data: iceEvent.candidate,
};
ws.send(message);
} else {
// All ICE candidates have been sent
}
};
So the peer that creates offer sends only ONE ice candidate and i think this is the problem becouse the peer creating answer sends TWO ice candidates.
What can be a problem here? When should i call addIceCandidate ?
This is example console log with sent and recieved data
Peer offering connection:
sent: CONNECT Object {type: "CONNECT", caller: Object, callee: null, room: Object, data: null}
recieved: CONNECT Object {type: "CONNECT", caller: Object, callee: null, room: Object, data: null}
sent: OFFER Object {type: "OFFER", caller: Object, callee: Object, room: Object, data: Object}
sent: CANDIDATE Object {type: "CANDIDATE", caller: Object, callee: Object, room: Object, data: Object}
sent: CANDIDATE Object {type: "CANDIDATE", caller: Object, callee: Object, room: Object, data: Object}
recieved: ANSWER Object {type: "ANSWER", caller: Object, callee: Object, room: Object, data: Object}
recieved: CANDIDATE Object {type: "CANDIDATE", caller: Object, callee: Object, room: Object, data: Object}
Peer creating answer:
sent: CONNECT Object {type: "CONNECT", caller: Object, callee: null, room: Object, data: null}
recieved: OFFER Object {type: "OFFER", caller: Object, callee: Object, room: Object, data: Object}
recieved: CANDIDATE Object {type: "CANDIDATE", caller: Object, callee: Object, room: Object, data: Object}
recieved: CANDIDATE Object {type: "CANDIDATE", caller: Object, callee: Object, room: Object, data: Object}
sent: ANSWER Object {type: "ANSWER", caller: Object, callee: Object, room: Object, data: Object}
sent: CANDIDATE Object {type: "CANDIDATE", caller: Object, callee: Object, room: Object, data: Object}