Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Peerjs reconnecting not working fine sometime one of the device is not connected #1162

Open
hassanascend opened this issue Nov 22, 2023 · 0 comments
Labels
client related to peerjs client

Comments

@hassanascend
Copy link

I creating an video chat application with peerjs, socket (Nodejs) and front end is reactjs application.On join room it works fine but for reconnect it is not working fine. I test it with turning internet off for one device but sometime one of the remote device cannot see reconnected user

Below is my front end reactjs code to reconnect peer connection for video chat application.
In which i check if internet is restore check via socket.

```

useEffect(() => {
const recPeerAndJoinRoom = async () => {
try {
setRemoteStreams([])
setPrevPeerId(peer._lastServerId)
setIsReconnected(true)
initPeerJsConnection()
} catch (error) {
console.log(error)
}
}

    if (isSocketConnected) {
      if (roomActive) {
        if (peer.disconnected) {
          console.log('disconnected peer')
          recPeerAndJoinRoom()
        } else {
          joinAndRec()
        }
      }
    }
  }, [isSocketConnected]);


const joinAndRec = async (prevPeerId = null) => {
    const payload = {
      roomId: myRoomId,
      userId: peer.id,
      userName: userName,
      uuId: uuId,
      rejoin: prevPeerId ? false : true,
      prevPeerId: prevPeerId
    }
    await socket.emit('join-room', payload)
    await socket.emit('reconnected-from-client', myRoomId, peer.id)
    setRemoteStreams([])
    userConnected(localStream)
  }

const userConnected = async streamTmp => {
    console.log('socket--->', socket)
    await socket.emit('ready', myRoomId, peer.id)

    /*below on call function will be added to peer events*/
    peer.on('call', call => {
      console.log('call')
      handleIncomingCall(call, streamTmp)
    })

    /*below user-connection function will be added to socket events*/
    socket.on('user-connected', remoteUserId => {
      if (remoteUserId !== null) {
        initiateCall(remoteUserId, streamTmp)
      } else {
        // console.log('User Id is null')
      }
    })

    setLocalStream(streamTmp)
    setRoomActive(true)
  }
  
  const initPeerJsConnection = async () => {
    const PeerJs = (await import('peerjs')).default
    const peerConfig = process.env.NEXT_PUBLIC_NODE_ENV === 'local' ? {} : ICESERVER
    const peerInstance = new PeerJs(peerConfig)

    // Hanldle Connection
    await peerInstance.on('open', userId => {
      setPeer(peerInstance)
    })
    peerInstance.on('error', err => {
      console.log(err)
    })
    peerInstance.on('disconnected', () => {
      // console.log('disconnected', peerInstance)
      // peerInstance.reconnect()
    })
    return peerInstance
  }

  Below is my back end nodejs code for ping pong technique and after every 5 seconds i check if pong difference is between 6 to 40 seconds then emit 'connection-lose' to remote screens.

  

socket.on("pong", (roomId, uuId) => {
const user = rooms[roomId]?.find((item) => item.uuId === uuId);
if (user) {
user["pingAt"] = new Date();
}
});

    const pingInterval = setInterval(() => {
      io.to(payload.roomId).emit("ping", payload.roomId);

      setTimeout(() => {
        connectionInterval();
      }, 2000);
    }, 5000); // Send "ping" event every 5 seconds

    // Have to re-write this code
    const connectionInterval = () => {
      const currentTime = new Date().getTime();
      const roomId = payload.roomId;

      rooms[roomId]?.forEach((user) => {
        const timeDifference = currentTime - user.pingAt.getTime();
        if (timeDifference <= 6000) {
          if (user) {
            if (!user["connection"]) {
              user["connection"] = true;
              io.to(roomId).emit(
                "reconnected-from-server-lack",
                user.peerId,
                timeDifference
              );
            }
          }
        } else if (timeDifference > 6000 && timeDifference < 40000) {
          if (user) {
            if (user["connection"]) {
              user["connection"] = false;
              io.to(roomId).emit("connectionLose", user.peerId, timeDifference);
            }
          }
        } else if (timeDifference >= 40000) {
          removeParticipant(socket, roomId, user.peerId, 2);
        }
      });
    };
May be my way is not right please suggest better one also if anybody knows.
@irgalamarr irgalamarr added the client related to peerjs client label Feb 24, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
client related to peerjs client
Projects
None yet
Development

No branches or pull requests

2 participants