server code handling sockets
socket.on("callUser", (data) => {
const targetSocket = userSockets.get(data.userToCall.toString());
targetSocket.emit("callUser", {
signal: data.signalData,
from: data.from,
});
});
socket.on("answerCall", (data) => {
const targetSocket = userSockets.get(data.to.toString());
targetSocket.emit("callAccepted", data.signal);
});
video chat code.
//imports removed to reduce code
const VideoChatContext = createContext()
function VideoChatContextProvider({ children }) {
//state and ref variables removed to reduce code
const answerCall = (from, signal) => {
setCallAccepted(true)
const peer = new Peer({ initiator: false, trickle: false, stream })
peer.on('signal', data => {
socket.emit('answerCall', { signal: data, to: from })
})
peer.on('stream', currentStream => {
userVideo.current.srcObject = currentStream
})
peer.signal(signal)
connectionRef.current = peer
}
useEffect(() => {
navigator.mediaDevices
.getUserMedia({ video: true, audio: true })
.then(currentStream => {
setStream(currentStream)
myVideo.current.srcObject = currentStream
})
socket.on('callUser', ({ from, signal }) => {
setCall({ isReceivingCall: true, from, signal })
answerCall(from, signal)
})
}, [])
const callUser = id => {
const peer = new Peer({ initiator: true, trickle: false, stream })
peer.on('signal', data => {
socket.emit('callUser', {
userToCall: id,
signalData: data,
from: getUserId(),
})
})
peer.on('stream', currentStream => {
console.log('stream', currentStream)
userVideo.current.srcObject = currentStream
})
socket.on('callAccepted', signal => {
setCallAccepted(true)
peer.signal(signal)
})
connectionRef.current = peer
}
return (
//removed to reduce code
)
}
export { VideoChatContextProvider, VideoChatContext }
Site 2 is using similar code to site 1 without callUser. The socket events are working and site 2 works but am not able to get the video stream from site 2 to site 1. peer.on('stream') is not firing.
getUserId() is from useAuthState.
callEnded, callAccepted, and stream are useState.
myVideo, userVideo and connectionRef are useRef.