Embedding Zoom meeting in my App

Need help APIs
1

Hi there,

I want to embed Zoom meetings in my app, so that users don’t need to leave the app and use the Zoom app for participating in meetings.

According to Zoom I can use their web SDK client but wondered if this was workable with bubble.

To be clear, I knwo there are Bubble plugins fro creating meetings which are great but I can;t see anythign for actually embedding the meeting itself into Bubble.

Any ideas much appreciated.

I’ve added a little info from the Zoom documentation below.

Thanks,

Martin

The Fully Customizable Web SDK can be imported locally into an existing Node.js app through npm, or into any HTML5 project through a CDN (content delivery network).

Before you get started:

Using the Fully Customizable Web SDK will require experience using async functions & promises in JavaScript. You’ll need a camera and microphone for testing, and a backend (server-side) service to securely generate a signature to launch a session.

2 Likes
2

Hey @martin9, any luck with this? Currently building this out now. Starting a meeting on the page is the current blocker.

3

Hey, @dbevan yes, got this all sorted. My app uses a JWT solution which means no OAuth and meetings created for different Zoom users on my organisations’ accounts by API. Essentially we offer yoga classes and have a bunch of Zoom licenses that the app books classes to. Let me know if you need any help or have a similar use case and I can help.

1 Like
4

I build a private plugin and got everything to work. All good. Thanks for your response!

5

i am in a dire need of this functionality, would you care to elaborate how you achieved this? thanks in advance

6

@gasser.wshalaby I built a Bubble plugin to service the Zoom Meetings SDK requirements.

https://marketplace.zoom.us/docs/sdk/native-sdks/introduction
Zoom Meeting Web SDK (TIP: Try and follow the GitHub examples as best you can.)

I’d never built a Bubble plugin before so to reduce my learning curve, I purchased this course: Copilot Courses. It’s a tad outdated as you’ll need to use “Server-side Actions” but great to get comfortable with the plugin editor.

Other than that, I scoured the forums. Also, @jared.gibb seems to know his way around the plugin editor very well. I believe I followed one of his suggestions (I can’t find the source). @Jici as well!

Good luck!

2 Likes
7

@dbevan - did you use component view or client view for this? Currently struggling with the way the component view renders in the app - if I click in the wrong place the chat popper somehow gets lost and can’t be re-opened - did you get any of the same?

8

Component. You have to manipulate the hell out of the component using custom code. I would recommend doing the following:

  1. Add an HTML element to the page. You’ll use this to add all of your CSS. <style>enter your custom styling here</style>. Make sure to use !important at the end of each line so if prioritizes your code.

  2. In order to add styling to specific divs/imgs/etc., you’ll need to use your browser’s inspect tool to find the particular code from the SDK element.

  3. Understand 2 things. a) Zoom’s SDK documentation sucks! b) Zoom’s SDK isn’t Bubble friendly. You have to take it upon yourself to find how to fit Zoom into your specific use case as best you can.

For context, I learned more JS and CSS tricks/tips during this implementation than my previous experiences 6 years prior.

Good luck!

1 Like
9

Thanks Daniel!

1 Like