Web Meeting SDK version 2.0.1

[tommy (Tommy Gaessler)]

Hey Zoom Developers, we have some really exiting updates!

The Web Meeting SDK v2.0.1 release includes the following.

• The Web Meeting SDK Component View provides the option to embed the Web Meeting SDK as components in your page, allowing for a more-flexible design.
• The Web Meeting SDK Client View provides the option to display the Web Meeting SDK as a full page. This allows for a familiar Zoom Meeting experience because the Client View is the same as the Zoom Web Client, except it lives inside your own web page.

You can choose one view to use in your integration.

Client View (Existing)

Added

• Mask Background feature
• Setting to “Mirror my Video”
• Meeting Reactions
• Side-by-side layout support when screen sharing in Chrome
• Ability to customize recording disclaimer content
• Support for showing the user a notice when archiving and live streaming
• A dialog for attendees to first provide consent when being promoted to a panelist in webinars
• Privacy notices for various features

Enhanced

• Waiting page when a meeting has not yet started

Fixed

• The “TypeError: I.isMatchingType is not a function” bug from ~v1.9.5

Component View (New)

Added

• Joining, leaving, and ending meetings and webinars
• Reconnecting when connection state changes
• Privacy notices to various features such as chat and recording
• Viewing meeting information and copying invite link
• Active Apps Notifier
• Starting, pausing, and stopping screen sharing
• Receiving screen sharing
• Participants panel, with participant controls such as “mute” and “rename”
• Waiting Room
• Joining and leaving audio
• Muting and unmuting the microphone
• Gallery, Ribbon, Speaker, and Minimized views
• Highlighting most recently active participant in video views
• Toggling video capture
• Public and private chat in meetings and webinars
• Security settings like enabling waiting room and locking meetings
• Starting, pausing, and stopping cloud recording
• Receiving local and cloud recording status
• Settings panel, with options for Audio, Video, and Share Screen
• Raising and lowering hand
• Panelist and attendee views in webinars
• Promoting attendees and demoting panelists
• Promote consent (attendee is shown a consent dialog, which they must accept to be promoted to a panelist)
• Multiple languages (i18n)
• Adding custom buttons to the toolbar dropdown
• APIs to safely and programmatically interact with a meeting or webinar

To learn more about the new Component View, please checkout the docs: https://marketplace.zoom.us/docs/sdk/native-sdks/web

Thanks,
Tommy

[lfrancia (Lara Joy)]

Hi @tommy,

Is it 2.0.0 or 2.0.1? Because on changelog page, it shows 2.0.1.

Lara

[daniel2 (Daniel)]

This is really exciting news! Would like to see some screenshots to demo the new Components View, so we can get a glimpse of what it looks like.

[daniel2 (Daniel)]

Component View not exported

I’m sorry to inform you that it seems like you have forgotten to actually add the Component Embedded package as a submodule or an export. So you can’t actually import it.

I tried using all these variants, but with no luck:

import ZoomMtgEmbedded from "@zoomus/websdk/embedded"
const ZoomMtgEmbedded = require("@zoomus/websdk").embedded
import {embedded as ZoomMtgEmbedded } from "@zoomus/websdk"

Failed to compile. Module not found: Can't resolve '@zoomus/websdk/embedded'

What does work though is to manually import the file, instead of the module, like so:

import ZoomMtgEmbedded from "@zoomus/websdk/dist/zoomus-websdk-embedded.umd.min.js"

Fix

Here’s how to fix it on your part.

1. Add an embedded.js file next to your package.json, which looks exactly like the index.js file, like so:

'use strict';

module.exports = require('./dist/zoomus-websdk-embedded.umd.min');

2.Now you can import using import ZoomMtgEmbedded from '@zoomus/websdk/embedded'

[daniel2 (Daniel)]

I had trouble joining a meeting with the Component (Embedded) View SDK, getting an HTTP Error 403 when it was requesting the AV lib files from Zoom’s servers. Note: This at least happened on localhost.

To fix it I used the local av files like so:

import ZoomMtgEmbedded from '@zoomus/websdk/embedded'

const client = ZoomMtgEmbedded.createClient()

client.init({
  assetPath: require('path').resolve('node_modules/@zoomus/websdk/dist/lib/av'),
  /* rest of the init parameters... */
})

[tommy (Tommy Gaessler)]

Hey @daniel2 , @lfrancia ,

We did have a misconfiguration on the Component View. We are pushing 2.0.1 to NPM and CDN soon.

@daniel2 , screenshots will be posted soon on our docs.

Thanks,
Tommy

[ychama15 (Yazan)]

Hi,
Does this support custom css easily now ?

[tommy (Tommy Gaessler)]

Hey @ychama15 , @daniel2 , @lfrancia ,

Version 2.0.1 has now been published: @zoomus/websdk - npm

@ychama15 , not custom CSS, you can override the CSS if you choose. It does support custom buttons in the dropdown however. Checkout the docs: https://marketplace.zoom.us/docs/sdk/native-sdks/web/component-view/reference

Thanks,
Tommy

[elearningevolve (Adeel (Founder eLearning evolve))]

@tommy 2 issues in v2.0.1 of the SDK
When changing the reaction skin tone there is a JS error and not able to change it.
react-dom.min.js:17 Uncaught ReferenceError: isViewOnly is not defined
at zoom-meeting-2.0.1.min.js:2
at redux-thunk.min.js:1
at n. (zoom-meeting-2.0.1.min.js:2)
at zoom-meeting-2.0.1.min.js:2
at onClick (zoom-meeting-2.0.1.min.js:2)
at Object.sh (react-dom.min.js:164)
at rh (react-dom.min.js:13)
at uh (react-dom.min.js:13)
at Ge (react-dom.min.js:15)
at vh (react-dom.min.js:165)

Moreover, there is no option to Add a background image only 4 available backgrounds to select from. This is such a huge limitation while adding support for background. Is this the expected behavior?

[wayaragil (Waya Putra Ragil)]

@tommy

Mirror my Video

Hello @tommy ,
looks like “Mirror My Video” is not working either. You can test it in 2 different browsers

[ali.syed (Syed Sadiq)]

there is a black screen in the page in this new sdk … nothing is visible above zoom bottom bar.

also in dom there is no speaker-view div, as was there in previous sdk.

[tommy (Tommy Gaessler)]

Hey @ali.syed , @wayaragil , @elearningevolve ,

For support, please post the issue in #web-meeting-sdk and not the changelog.

Please make sure to fill out the post template so we have all the info needed to assist you.

Thanks,
Tommy

[elearningevolve (Adeel (Founder eLearning evolve))]

Sure @tommy, added it under the correct section here.
@ali.syed @wayaragil please join me here.

[tommy (Tommy Gaessler)]

Thanks @elearningevolve ,

We will take a look.

-Tommy

[rudolf]

@tommy
We plan on implementing the SDK on a WordPress website.
Would it be possible to import the WordPress user name as the meeting user name for users that are logged in to WP when they join a zoom meeting on one of the site’s pages?

[elearningevolve (Adeel (Founder eLearning evolve))]

Yes, it is possible we are already doing it in our WP plugin. You simply need to pass the WP user name to the JS Join function of the SDK.

 ZoomMtg.join({
    meetingNumber: {your_meeting_no}
    userName: {WP_username],   
   .......
   .......      

[tommy (Tommy Gaessler)]

Thanks @elearningevolve !

CC @rudolf .

-Tommy