Angular4 Integration with JS SDK

We are attempting to integrate JS SDK with an existing Angular4 application.
Integration is done following the documentation.
However post integration, it’s found that the Zoom SDK itself gets initiated creating a black screen over the existing angular application.

Any documentation, or sample integration application with Angular 4 is really helpful.image

Steps to reproduce the behavior:

  1. Integrate SDK as mentioned in the developer guide.
  2. Application starts with a black screen

Hey @dumparun, thanks for reaching out and using Zoom!

Can you try adding the zmmtg-root id onto the html tag where you would like the meeting to display?

You could also use CSS Z-Index to place the meeting behind your app while you do not need to display it. Css Display hidden could also work.

Let me know if this helps!

Thanks,
Tommy

Thanks Tommy

Attached screen shot when i tried adding div inside html. There are two such divs created now. Ideally, i would like to get the zoom div, and related divs (chat etc) within the application div, post which it would be easy to control the placement and colors using CSS.

Regards
Arun

Thanks @dumparun,

For now I would suggest using CSS to customize when/where it displays.

Also reference this work around:

We will have a No-UI Zoom SDK that can be customizable in the future, most likely early next year. You can follow our release log here.

Thanks, Tommy

Hi @tommy,

We tried as suggested by you,

We are now able to open zoom meeting in iframe, but we are unable to see the video stream of other participants, we get notification that participant joined.

Thanks,
Kaptan

Hey @kaptan,

Can you send me a screenshot of what you see and steps to reproduce? When you say you can’t see video of other participants, are those participants using the iFrame or Zoom Client?

Also can you confirm that video is turned on?

Thanks,
Tommy

Hi Tommy,

We are able to see the video of participants now.
However, it’s in a speaker view.

We would like to use gallery view, does JS SDK supports Gallery View?
Is there a work around or roadmap for supporting the same?
Appreciate your support.

Regards
Arun

Hey @dumparun,

Glad you are able to see participants now :slight_smile:

Unfortunately the Web Client or SDK does not support Gallery View. We will work on adding this in the future.

Here are the current requirements for Gallery View.

Thanks,
Tommy

Thanks Tommy,

Any tentative timeline you are looking for this feature to be available?

Hey @dumparun,

I don’t have anything super specific, but sometime next year.

You can track our releases here to be notified when it’s available.

Thanks,
Tommy

Hey @tommy,

Till few days back Webclient was working fine inside iFrame, but recently it stops working and we are receiving

Refused to display ‘https://zoom.us/wc/848368620/start?prefer=1&un=KFJldGQuKSBKdXN0aWNlIEthbWFsYSBLYW5uYW4gKEFyYml0cm’ in a frame because it set ‘X-Frame-Options’ to ‘deny’.

Hey @kaptan,

We are working on fixing this, apologies and thanks for your patience.

Duplicate posts:

Thanks,
Tommy

Hey @kaptan,

We will have this (/wc path) fixed in a release coming this weekend.

Thanks again for your patience.

-Tommy

Hi @tommy,

Now the x-frame issue is not there, thanks for updates.

But now when we are trying to start meeting using start URL which contains ZAK, In iFrame its redirecting to login page.

Earlier below configurations was working

We have implemented zoom webclient in iframe with https://zoom.us/wc/ Is there a way to start a meeting by passing the zak and prefer like , https://zoom.us/wc/{{meetingId}}/start?zak={{zak}}&prefer=0 ? currently the user is being redirected to login page.

1 Like

Hey @kaptan,

The host user must be logged in now to start the meeting.

You have 2 options:

  1. Sign into your Zoom account in the iFrame to start the meeting.

Or

  1. If you are already signed in to your Zoom account on your browser, then embedding the start_url in the iFrame will start the meeting as expected without having to sing in (again).

Thanks,
Tommy

Hi @tommy,

Below is our scenario

We have group of users out of them one user is admin, when all users join the meeting they need to wait until admin/host joins.

Admin is not aware of its zoom credentials, as we are managing the meetings behind the scene.

Based on above scenario how we can meet our requirement.

2 options suggested by you will not meet our requirement.

Please suggest…

Regards,
Kaptan

Hey @kaptan,

Make sure your join before Admin/host settings is turned off, you can do this when you create the meeting via the API request body settings > join_before_host, or the host / account settings:

Thanks,
Tommy

Hi @tommy,

Already did this setting, but admin wants to join, but iFrame not allowing Admin to join and its redirecting to login page, we already have ZAK.

Regards,
Kaptan

Oh I see, @kaptan.

The host now has to login or be logged in to start the meeting via iFrame.

Thanks,
Tommy

Hye tommy hope so you r doing Well i am integrating zoom in angular application
i getting this error and appplication stucks.