How to differentiate different users on Zoom React Web SDK?

We are an educational institution and have integrated Zoom Web SDK on our website for students to join the classes directly from the browser.

Currently the issue we are facing is that all the users who join through the SDK have the name ‘React’ (or any name we give on the app.js file).

It is very difficult to differentiate between various students during the class with the same name. Also it is difficult for us in maintaining the database records for each student. Essentially we want to manage the DB records the same way we do in Mobile application or zoom web application with the SDK.

The teachers or any other person cannot rename the students manually in every meeting as it would not be feasible.

What would be an efficient way to differentiate between users and also manage the database records properly?

Thanks!

Hey @devansh30081999,

Thank you for reaching out to the Zoom Developer Forum. For this, you’ll want to have your own text field where the user can enter their name or pull their name from your DB. Then, when joining the meeting, you would set the userName in the meeting configuration to the name you want to use.

Let me know if that helps.

Thanks,
Max

Hello @MaxM.

While using the zoom react web SDK an idea came to my mind that it would be great if before joining the meeting we ask the user to fill a form just like an html form that would take user input for meeting id, passcode and userName and then we would pass this user input to the App.js component.

I tried to create this prototype in another react app and it worked I was able to pass the user input to app.js component.

But when I came back to implement it in the SDK I realized that it is not working here because the app component is the SDK is a functional component and I was by default using class component in other react app.

Now the challenge here is that the functional component cannot interact with the user input as the cannot use the useState and setState methods. So how do I pass the variables into this app ?

It would be really helpful if you could provide the class component alternative of the following code :

Or any other way to pass variables of username/id/password?

Thanks!

Hey @devansh30081999,

Unfortunately, I wasn’t able to find a React expert that could advise on this implementation detail. You may have to rearchitecht your implementation so that the view can communicate with the model you’re using.

Thanks,
Max