Can I use an iFrame with the Meeting SDK app type for authorization?

Meeting SDK Web
1

I had integrated a Zoom meeting into a user portal using JWT app type authorization and an iFrame for rendering. Everything worked fine until last week when I could no longer connect to the meeting. I began to see the error message: errorMessage: 'Fail to join the meeting.', errorCode: 1.

Considering that it might be due to the fact that the JWT app type is going to be disabled from September 1, I switched to using the Zoom Meeting Web SDK component view with the Meeting SDK app type for authorization. While I can now connect to the meeting, I find the component view challenging to manage and render as needed.

My question is: can I still use an iFrame with the Meeting SDK app type for authorization? And if yes, how I would need to modify the current function, below, to generate iFrame’s src attribute to work with the Meeting SDK app type?

src() {
      if (!this.signature) return "";

      const props = {
        signature: this.signature,
        mn: this.meetingNumber,
        apiKey: this.apiKey,
        name: this.userName,
        pwd: this.passWord,
        email: this.userEmail,
        lang: this.lang,
        china: "0",
        role: "0",
        leaveUrl: this.leaveUrl,
        tk: this.tk,
      };
      return `/zoom?${this.serialize(props)}`;
    },
2

@itango8 , have you already hosted your meeting sdk for web?

3

@chunsiong.zoom Yes, we have hosted the Zoom Web SDK assets in our Nuxt 2 user portal. We have a dedicated directory under static named zoom where the necessary SDK files are located. We use an iframe to render the Zoom meeting within our application, and the src attribute for this iframe is dynamically generated as shown in the previous message.

As mentioned earlier, I recently experimented with another approach. I installed the @zoomus/websdk npm package and imported the embedded version of the Zoom meeting using import ZoomMtgEmbedded from “@zoomus/websdk/embedded”;. I then rendered the meeting within the component view. While I can connect to the meeting using this method, I find the component view challenging to manage and render as required. That’s why I would like to revert to using an iFrame to display the Zoom meeting.

4

I’ve got it working with our current setup. I had to update the signature generation function in the backend to use the meeting SDK app type credentials for authorization and switch references from apiKey to sdkKey in the frontend.

5

@itango8 ,

Here are some responses inline

I had integrated a Zoom meeting into a user portal using JWT app type authorization and an iFrame for rendering. Everything worked fine until last week when I could no longer connect to the meeting. I began to see the error message: errorMessage: 'Fail to join the meeting.', errorCode: 1.

There is a high chance you are using an older version of Meeting SDK Web 2.6 or below. On 5th August there was an enforcement of minimum version of SDK. You have to use version 2.7 or above after 5th August. I’ll recommend you to use the latest version.

Considering that it might be due to the fact that the JWT app type is going to be disabled from September 1, I switched to using the Zoom Meeting Web SDK component view with the Meeting SDK app type for authorization. While I can now connect to the meeting, I find the component view challenging to manage and render as needed.

Client view also has the same authentication method as Component view. Both of them uses Meeting SDK App Type for Auth.

My question is: can I still use an iFrame with the Meeting SDK app type for authorization? And if yes, how I would need to modify the current function, below, to generate iFrame’s src attribute to work with the Meeting SDK app type?

Yes you can. There are 2 places you can generate your JWT token. This might be beyond the scope of this dev forum, but here’s the high level overview

  • Generate the JWT token in the hosted web app (the application which is within the iframe)
  • Generate the JWT token in the iframe web app.

For the code which you have shared, it looks doable. But on your hosted web app, it needs to retrieve the values (signature, meetingNumber, apikey, username, password, email, lang, leaveurl etc…) from URL querystring

6

@itango8 ,

good to hear that you got it working :smiley:

7

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