Zoom Meeting SDK web sample

Use of this sample app is subject to our Terms of Use.

The Zoom Meeting SDK for web embeds the Zoom Meeting and Zoom Webinar experiences on a webpage through a highly optimized WebAssembly module.

Installation

To get started, clone the repo:

$ git clone https://github.com/zoom/sample-app-web.git

Setup

1. Once cloned, navigate to the sample-app-web/CDN directory for the Client View CDN sample, or sample-app-web/Local for the Client View NPM sample, or sample-app-web/Components for the Component View NPM sample:

   $ cd sample-app-web/CDN or $ cd sample-app-web/Local or $ cd sample-app-web/Components

2. Then install the dependencies:

   $ npm install

3. Get signature from backend https://github.com/zoom/meetingsdk-auth-endpoint-sample and modify .env with you key

   git clone https://github.com/zoom/meetingsdk-auth-endpoint-sample --depth 1 && cd meetingsdk-auth-endpoint-sample && cp .env.example .env && npm install && npm run start

   Key	Value Description
   CLIENT_ID/ZOOM_MEETING_SDK_KEY	Your Client ID or SDK Key. Required.
   CLIENT_SECRET/ZOOM_MEETING_SDK_SECRET	Your Client Secret or SDK Secret. Required.

   backend Meeting SDK JWT generator

4. Run the app:

   $ npm start

Usage

1. Navigate to http://localhost:9999 for the CDN or Local sample, or http://localhost:3000 for the Components sample. Then, enter in a Meeting or Webinar number and passcode, choose host or attendee (participant), and, click "join".

   Client View

   

   The Client View provides the option to display the 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.

   Nodejs 16

   If you are using Nodejs 16, please use npm install --force to proceed with the installation.

   Component View

   

   The Component View provides the option to display the Meeting SDK in components on your page. This allows for a more flexible design.

Learn more about Gallery View requirements and see more product screenshots.

For the full list of features and event listeners, as well as additional guides, see our Meeting SDK docs.

Use ZFG(Zoom For Government). You need apply new sdk key for ZFG.

option1 change package.json and use zfg specific version

"@zoom/meetingsdk": "3.11.2-zfg"

option2 change webEndpoint use ZFG Client View Component View

#Client view
ZoomMtg.setZoomJSLib("https://source.zoomgov.com/{VERSION}/lib", "/av");
ZoomMtg.init({
   webEndpoint: "www.zoomgov.com",
});

#Component view
const client = ZoomMtgEmbedded.createClient();
client.init({
 assetPath: 'https://source.zoomgov.com/{VERSION}/lib/av',
 webEndpoint: "www.zoomgov.com"});

Need help?

If you're looking for help, try Developer Support or our Developer Forum. Priority support is also available with Premier Developer Support plans.