zoom-video-sdk-web

Implements browser-based video sessions with the Zoom Video SDK for JavaScript and TypeScript.

5.3k|765|Updated Mar 4, 2026
One-click install
npx skills add https://github.com/openai/plugins --skill zoom-video-sdk-web
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: zoom-video-sdk-web
Source: https://github.com/openai/plugins/tree/main/plugins/zoom/skills/video-sdk/web
Command: npx skills add https://github.com/openai/plugins --skill zoom-video-sdk-web

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires @zoom/videosdk, jsrsasign, and includes references (resource) components.

What problem does it solve?

Building custom video applications in the browser with the Zoom Video SDK involves a strict lifecycle, event-driven rendering, and many silent-failure pitfalls such as calling getMediaStream() before join() or using the deprecated renderVideo(). This Skill provides expert guidance, working code patterns, and troubleshooting references to implement sessions correctly the first time.

Core Features & Use Cases

  • Session Lifecycle Guidance: Enforces the correct order of createClient, init, join, and getMediaStream to avoid undefined stream errors.
  • Feature Implementation Patterns: Provides complete code for video rendering with attachVideo(), screen sharing, chat, cloud recording, live transcription, command channel, and virtual backgrounds.
  • Framework Integrations: Includes Next.js (App and Pages Router), React hooks, and Vue/Nuxt quickstart patterns with server-side JWT generation.
  • Use Case: A developer building a telehealth web app uses this Skill to join a Video SDK session, render participant videos via peer-video-state-change events, and add in-session chat without hitting common integration bugs.

Quick Start

Ask the assistant to help you join a Zoom Video SDK session in the browser and render participant video using attachVideo.

Frequently Asked Questions about zoom-video-sdk-web

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I join a Zoom Video SDK session in the browser?

Create the client with ZoomVideo.createClient(), call await client.init(), then await client.join(topic, signature, userName). The JWT signature must be generated server-side using your SDK Key and Secret, and getMediaStream() only works after join completes.

Why does getMediaStream() return undefined in the Zoom Video SDK?

getMediaStream() returns undefined when called before client.join() completes. The media stream object only exists after a successful session join, so always await join() first, then call client.getMediaStream().

How do I render participant video with the Zoom Video SDK for Web?

Use stream.attachVideo(userId, VideoQuality.Video_360P), which returns a VideoPlayer element to append to the DOM. Listen for the peer-video-state-change event to attach or detach videos, and avoid the deprecated renderVideo() method.

Does the Zoom Video SDK work with Next.js and React?

Yes, but the SDK uses WebAssembly and must run client-side only. In Next.js use the 'use client' directive or dynamic import with ssr: false, and generate JWT signatures in API routes. An official @zoom/videosdk-react hooks library is also available.

Why is HD video not working in the Zoom Video SDK?

HD video requires SharedArrayBuffer, which needs Cross-Origin-Opener-Policy: same-origin and Cross-Origin-Embedder-Policy: require-corp headers on your server. Check support with stream.isSupportHDVideo() before calling startVideo({ hd: true }).

What browsers support the Zoom Video SDK for Web?

Chrome 80+, Firefox 75+, Safari 14+, and Edge 80+ support core video and audio. Safari lacks virtual background support and requires macOS 15+ for screen sharing, while Firefox needs version 90+ for virtual backgrounds.