Error when following meetingsdk-sample-react guide

Hi,

I’m following your Zoom Meeting SDK Sample React guide and when I execute npm start I get the following errors:

1-

2-

As I said, I followed the readme instructions exactly ( also replacing App.js with App-new.js and deleting old App.js ).

@DaviidEb,

Thank you for posting in the Developer Forum. I tested on my end and was able to get the Component React SDK running with the following steps.

Steps redacted, please refer to post below for further guidance:

Let me know if the result is the same on your end. Here is a video of me running the React in component view for reference. Also, once confirmed, I will be sure to place a documentation update request to include the steps as well.

Best,
Donte

@DaviidEb,

Following up, It looks like the fix is actually easier than that. All you need to do is uncomment the highlighted line (linked below) in the Public > index.html file :

Uncomment this line:

Additionally, a documentation update request to include this step has been submitted as well. Let me know if you have any questions about this.

Best,

Hi @donte.zoom first of all thanks for reply to my post.

With your steps, everything is working okey!!

I would like to ask you a couple of questions more:

1- For each user that joins in a meeting, do i have to create a signature?

2- Following the previous question : I installed Zoom to my PC and I’m using my personal meeting id as meetingNumber (free account) and my access code as passWord.
So, why having 2 diferent functions like getSignature1(e) and setting role to 1 ( start meetings ) and getSignature2(e) and setting role to 0 ( join meetings ) for 2 different users like teacher ( can start a meeting ) and student ( can join a meeting but not create it ) each of them can start a meeting despite having assigned role to 0 to an student?

I hope I have explained myself in this last question :smile:

David.

Hello, @DaviidEb,

Correct, “each request to start or join a Zoom Meeting or Webinar must be verified by an encrypted signature authorizing each user to enter”. Please see our Generate Signature help documentation for greater details on this subject :

https://marketplace.zoom.us/docs/sdk/native-sdks/web/signature

Thank you for this question. Are you able to share a video reproducing a meeting being started when the role is set to 0? Also, can you confirm if you have joined before host enabled in your account settings? You can reference our help documentation here:

https://support.zoom.us/hc/en-us/articles/202828525-Allow-participants-to-join-before-host

Best,
Donte

Hi @donte.zoom ,

Now is working correctly , I think it was because in my second function for just joining created meetings “joinmeeting(signature)” as student , I was setting manually the signature ( probably because i was testing something) and not setting it from the paramater that i was receiving in that function.

Taking advantage of the post,

  1. I would like to know if its possible ,using the component view version, change the component size?If its possible, could you paste me an example?
  2. If i want to have different meetings for example , for each class like : Maths,Biology in the same web app, which steps should I follow?

Thanks again, you’re helping me a lot!
PD: I dont know if i should make a different post for this questions :sweat_smile:

Yes, is possible to position the component view, see our help documentation which includes a code snippet here :

https://marketplace.zoom.us/docs/sdk/native-sdks/web/component-view/positioning/

Are you looking to run an entirely different meeting? If so, can you can our concurrently meeting feature to accomplish that, here is our help documentation on this topic:

https://support.zoom.us/hc/en-us/articles/206122046-Can-I-Host-Concurrent-Meetings-

Alternatively, have you considered leveraging our Breakout Feature? You can pre-assign participants to the breakroom based on the class assignment.

https://support.zoom.us/hc/en-us/articles/360032752671-Pre-assigning-participants-to-breakout-rooms

This can be done programmatically via the Create Meeting API setting object. Check out this helpful developer forum on that matter:

Best,
Donte

Hi @donte.zoom,

Following this guide :

I’m still unable to resize the component view. Positioning the component is okay but when i try to edit the size it doesn’t works.

Inside the guide , there is an API Reference : https://marketplace.zoom.us/docs/sdk/native-sdks/web/component-view/reference/ which has an option called “CustomSize” . The problem here is that it shows me that i can change height and width properties but i dont know how and where ( I think this guide should detail these actions).

Regards,
David.

Hi, @DaviidEb,

A resizing guide was recently published, have you checked it out already ?

Resizing

Just now I was going to reply this post with that guide.

I followed the steps but the component size stills being the same.

I attach an image of my code :

David.

Hi,
Tested this and it looks like the Customize property is working as expected. Here is a screenshot of me setting the Zoom-SDK-Video-Canvas size:

Can you test again with Web SDK 2.3.5, I’ve linked it here.

My Init:


    client.init({
      debug: true,
      zoomAppRoot: meetingSDKElement,
      language: 'en-US',
      customize: {
        meetingInfo: ['topic', 'host', 'mn', 'pwd', 'telPwd', 'invite', 'participant', 'dc', 'enctype'],
        video: {
          isResizable: true,
          viewSizes: {
            default: {
              width: 1000,
              height: 600
            },
            ribbon: {
              width: 300,
              height: 700
            }
          }
        },
        toolbar: {
          buttons: [
            {
              text: 'Custom Button',
              className: 'CustomButton',
              onClick: () => {
                console.log('custom button');
              }
            }
          ]
        }
      }
    });

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