Joining meeting timeout (react app)

Description
Here is the code on my component :
const meetConfig = {
meetingNumber: 123456789,
userName: “AhmedAlaa”,
passWord: 0,
leaveUrl: ‘URL’
}

    ZoomMtg.setZoomJSLib('https://source.zoom.us/1.7.5/lib', '/av')
    ZoomMtg.preLoadWasm();
    ZoomMtg.prepareJssdk();

    ZoomMtg.generateSignature({
      meetingNumber: meetConfig.meetingNumber,
      apiKey: API_KEY,
      apiSecret: API_SECRET,
      role: 1,
      success (res) {
        console.log('signature', res.result)
        ZoomMtg.init({
          leaveUrl: meetConfig.leaveUrl,
          disableCallOut: true,
          disableRecord: true,
          isSupportQA: false,
          isSupportCC: false,
          showPureSharingContent: false,
          screenShare: false,
          disableJoinAudio: false,
          audioPanelAlwaysOpen: false,
          isSupportChat: true,
          videoDrag: false,
          disableInvite: true,
          success () {
            ZoomMtg.join(
              {
                meetingNumber: meetConfig.meetingNumber,
                userName: meetConfig.userName,
                signature: res.result,
                apiKey: API_KEY,
                passWord: meetConfig.passWord,
                success () {
                  console.log('join meeting success')
                },
                error (res) {
                  console.log('Error generating signature')
                  console.log(res)
                }
              }
            )
          },
          error (res) {
            console.log(res)
          }
        })
      }
    })

Error

Which version?
1.7.5

Hey @Ahmed_Alaa,

Make sure you are using a valid meeting ID, and a JWT App type for the Key and Secret.

Thanks,
Tommy

It solveds by using valid meeting id
thank you

1 Like

Hey, I have the same issue. I cloned sample-app-web today and facing the same error as the screenshot above. How do I know which meetingId to put? Does the meeting have to be started elsewhere first?

Hello @nich


here you can schedule meeting and u will find meeting id you can generate new one or your personal meeting id
just take a look at the link and click on schedule a new meeting button

Hey @Ahmed_Alaa,

Thanks for providing a real meeting id! Glad you go it working! :slight_smile:

@nich, you will have to create and start a Zoom meeting first. You can do this with the Zoom app, the Zoom Web Portal, or the Create Meeting API.

Thanks,
Tommy

Hey @Ahmed_Alaa and @tommy , Can you share with us your setting on React App?

I’m currently trying to setting it up, but still have no luck.

This is my setting so far

ZoomMtg.preLoadWasm();
ZoomMtg.setZoomJSLib('https://source.zoom.us/1.7.5/lib', '/av')
ZoomMtg.preLoadWasm();
ZoomMtg.prepareJssdk();

ZoomMtg.generateSignature({
  meetingNumber: meetConfig.meetingNumber,
  apiKey: process.env.TITIKTEMU_ZOOM_API_KEY,
  apiSecret: process.env.TITIKTEMU_ZOOM_API_SECRET,
  role: 1,
  success (res) {
    console.log('signature', res.result)
    ZoomMtg.init({
      leaveUrl: meetConfig.leaveUrl,
      disableCallOut: true,
      disableRecord: true,
      isSupportQA: false,
      isSupportCC: false,
      showPureSharingContent: false,
      screenShare: false,
      disableJoinAudio: false,
      audioPanelAlwaysOpen: false,
      isSupportChat: true,
      videoDrag: false,
      disableInvite: true,
      success () {
        ZoomMtg.join(
          {
            meetingNumber: meetConfig.meetingNumber,
            userName: meetConfig.userName,
            signature: res.result,
            apiKey: API_KEY,
            passWord: meetConfig.passWord,
            success () {
              console.log('join meeting success')
            },
            error (res) {
              console.log('Error generating signature')
              console.log(res)
            }
          }
        )
      },
      error (res) {
        console.log(res)
      }
    })
  }
})

Thanks for the help

Hey @titiktemu,

Have you followed the NPM Install and setup guide?

Thanks,
Tommy

Hey @tommy, yes i have installed and stuck on set the config var

Below are my React component so far

componentDidMount() {

    const signatureEndpoint = 'https://titiktemu-zoom.herokuapp.com/'

    const apiKey = process.env.TITIKTEMU_ZOOM_API_KEY

    const meetingNumber = 123456789

    const role = 0

    const leaveUrl = 'http://localhost:9999'

    const userName = 'WebSDK'

    const userEmail = ''

    const passWord = ''

    ZoomMtg.preLoadWasm();

    ZoomMtg.setZoomJSLib('https://source.zoom.us/1.7.5/lib', '/av')

    ZoomMtg.prepareJssdk();

    ZoomMtg.generateSignature({

      meetingNumber: meetingNumber,

      apiKey: apiKey,

      apiSecret: process.env.TITIKTEMU_ZOOM_API_SECRET,

      role: role,

      success (res) {

        console.log('signature', res.result)

        const signature = res.result

        ZoomMtg.init({

          leaveUrl: leaveUrl,

          disableCallOut: true,

          disableRecord: true,

          isSupportQA: false,

          isSupportCC: false,

          showPureSharingContent: false,

          screenShare: false,

          disableJoinAudio: false,

          audioPanelAlwaysOpen: false,

          isSupportChat: true,

          videoDrag: false,

          disableInvite: true,

          success () {

            ZoomMtg.join(

              {

                meetingNumber: meetingNumber,

                userName: userName,

                signature: signature,

                apiKey: apiKey,

                passWord: passWord,

                success () {

                  console.log('join meeting success')

                },

                error (res) {

                  console.log('Error generating signature')

                  console.log(res)

                }

              }

            )

          },

          error (res) {

            console.log(res)

          }

        })

      }

    })

  } 

The problem are how i can render the component?

Can you help me to point out where i’m missing?