Issue creating session immediately after leaving another session

Video SDK Web
21

Hey @hazzal

Thanks for sharing the code snippet with us.

After analyzing the code, we found some issues when using the Video SDK that might cause the ‘IMPROPER_MEETING_STATE’ error. Here are some recommendations we provide:

const initialiseCall = useCallback(async () => {
  /**
   * Skip unrelated code.
   **/
  await client.init("en-US", "Global", {
    patchJsMedia: true,
    leaveOnPageUnload: true,
  });
  await client.join(zoomJwtResponse.session, zoomJwtResponse.jwt, username);
  console.log("session", client.getSessionInfo());
  /**
   * Skip unrelated code.
   **/
  // The next line mighe return rejected promise with "IMPROPER_MEETING_STATE"
  await zoomStream.startAudio();
}, [
  client,
  consultationId,
  consultationService,
  isPatient,
  renderVideo,
  username,
]);
//  Automatically execute once the `initialiseCall` method changes
useEffect(() => {
  void initialiseCall();
}, [initialiseCall]);

// Another place that calls the init and join methods.
const joinClient = useCallback(async () => {
  try {
    const remoteViewElement = canvasElementRef.current;
    const zoomJwtResponse = await consultationService.getZoomJwt(
      consultationId
    );
    console.log("joining zoom session with", zoomJwtResponse);
    await client.init("en-US", "Global", {
      patchJsMedia: true,
      leaveOnPageUnload: true,
    });
    await client.join(zoomJwtResponse.session, zoomJwtResponse.jwt, username);
    console.log("session", client.getSessionInfo());
   // The next line mighe return rejected promise with "IMPROPER_MEETING_STATE"
    await streamRef.current.startVideo();
  } catch (error) {
    console.error("Error joining Zoom session:", error);
  }
});

There are two rejoin logics in the code. According to my analysis and understanding, when you call the createNewSession and joinClient methods, the initialiseCall method within the useEffect will also execute automatically. The issue arises here. Since these two executions are independent, they are not blocked by await, leading to the following situation:


// execute sequence

-> await client.join // joinClient method

-> await client.init // initialiseCall method

When the client.join statement is executed in the joinClient method, the initialiseCall method might simultaneously execute the client.init statement. Since the client.init method resets the entire session state, the subsequent code in the joinClient method will not run as expected, which may result in the IMPROPER_MEETING_STATE error.

Either of the following solutions are viable:

  • Refine the initialiseCall method so that it is only called when the component mounts.

  • Remove the joinClient method and let React automatically trigger the initialiseCall method to join a new session when the consultationId changes. However, ensure that you refine the initialiseCall method by adding a cleanup function, as repeatedly binding event handlers to the client.on method might also cause issues.

Please let me know if you need any assistance with the issue.

Thanks
Vic

22

Hey @vic.yang

Ill give that a go, but the join client I just added to put a button in for testing, It doesnt ever get run without me pressing a temporary button I added, just so I didnt have to mess around with mounting the component to test joining and leaving a session.

Regards Harry

23

Hey @hazzal

Notably, since the initialiseCall method is scheduled to run by React, you need to pay attention to the dependencies of the useCallback within initialiseCall. Any changes in these dependencies will cause initialiseCall to be reassigned, which will trigger its execution. You can add breakpoints or logs to inspect this.

Thanks
Vic

24

Hey @vic.yang

The issue was that the dependencies were changing and causing the client to re-initialize during other functions running.

Thanks for the help

25

Hey @hazzal

I am glad to hear that you have identified the cause of the issue. If you have any other questions, feel free to contact me anytime.

Thanks
Vic

26

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.