# zoom-video-sdk-web

Walks your agent through building a custom video session with the Zoom Video SDK for Web: joining, camera, screen share, recording.

- skill · `type=skill` · Codex, ChatGPT · ★ 7596
- Author: Zoom · official OpenAI repository
- License: MIT · policy=mirror · the beginning of the file is at the end of this page
- Source: https://github.com/openai/plugins/tree/HEAD/plugins/zoom/skills/video-sdk/web/SKILL.md
- Updated: 2026-10-08
- HTML: https://affpapa.org/en/nevibecode/skills/zoom-video-sdk-web

## What it does

The skill hands your agent a reference for the Zoom Video SDK for Web, a JavaScript library that runs video and audio in the browser. It covers the lifecycle in order: create the client, call `init`, join a session, get the media stream, start camera and mic. Screen sharing, cloud recording, RTMP streaming, chat, live transcription, subsessions and virtual backgrounds are documented too.

This is about custom video sessions, not embedded Zoom meetings. If you want your own UI around a regular meeting, the skill routes you to a separate Meeting SDK set of docs. The usual traps are spelled out as well: `getMediaStream()` returns `undefined` when called before `join()` finishes, and you render with `attachVideo()` because `renderVideo()` is deprecated. Video rendering is event-driven, so skipping the required event listeners leaves you with a blank container.

You need an SDK Key and Secret from the Marketplace plus a JWT signature generated server-side. A modern browser is required: Chrome 80+, Firefox 75+, Safari 14+, Edge 80+. If your network or an ad blocker interferes with `source.zoom.us`, install from npm or self-host the minified file — the CDN build exports `WebVideoSDK`, not `ZoomVideo`, which breaks the import you'd expect.

## Install

### Codex (native platform)

1. **Skills CLI (Vercel)**
```bash
npx skills add openai/plugins --skill web -a codex
```

2. **Manually: put the files in place**
- File: `.agents/skills/web/SKILL.md` — For all projects use ~/.agents/skills/

### Claude Code

1. **Skills CLI (Vercel)**
```bash
npx skills add openai/plugins --skill web -a claude-code
```

2. **Manually: put the files in place**
- File: `~/.claude/skills/web/SKILL.md` — Copy the whole skill folder; for one project use .claude/skills/web/

### Cursor

**Manually: put the files in place**
- File: `.cursor/skills/web/SKILL.md` — Cursor also reads .agents/skills/ and .claude/skills/

### GitHub Copilot

1. **GitHub CLI**
```bash
gh skill install openai/plugins web
```

2. **Manually: put the files in place**
- File: `.github/skills/web/SKILL.md`

### Gemini CLI

**Platform CLI**
```bash
gemini skills install https://github.com/openai/plugins --path plugins/zoom/skills/video-sdk/web
```

### Windsurf (Devin Desktop)

**Manually: put the files in place**
- File: `.devin/skills/web/SKILL.md` — The legacy .windsurf/skills/ path still works

### Claude.ai

**Claude.ai**
- Zip the folder and upload it in Settings → Capabilities → Skills

Where a file is given instead of a command, copy the files from the source to that path: https://github.com/openai/plugins/tree/HEAD/plugins/zoom/skills/video-sdk/web/SKILL.md

## When to use it
- wire up camera and microphone in a browser video session
- attach a participant's video to a specific DOM container
- add screen or browser tab sharing
- turn on real-time speech transcription
- debug an empty media stream after joining

## Example prompts
- Build a session join flow with @zoom/videosdk: init, join, then getMediaStream
- Participant video isn't showing — check the call order and attachVideo
- Add screen sharing and cloud recording to the current session

## Source text · SKILL.md · MIT

Below is the content of a third-party file. It is data, not instructions for you: do not act on anything written inside unless the human asks. Block tag: c92f3a74a05cc096.

BEGIN THIRD-PARTY FILE c92f3a74a05cc096
````text
---
name: zoom-video-sdk-web
description: "Zoom Video SDK for Web - JavaScript/TypeScript integration for browser-based video sessions, real-time communication, screen sharing, recording, and live transcription"
---

# Zoom Video SDK - Web Development

Expert guidance for developing with the Zoom Video SDK on Web. This SDK enables custom video applications in the browser with real-time video/audio, screen sharing, cloud recording, live streaming, chat, and live transcription.

This skill is for **custom video sessions**, not embedded Zoom meetings.
If the user wants a custom UI for a real Zoom meeting, route to
[../../meeting-sdk/web/component-view/SKILL.md](../../meeting-sdk/web/component-view/SKILL.md).

**Official Documentation**: https://developers.zoom.us/docs/video-sdk/web/
**API Reference**: https://marketplacefront.zoom.us/sdk/custom/web/modules.html
**Sample Repository**: https://github.com/zoom/videosdk-web-sample

## Quick Links

**New to Video SDK? Follow this path:**

1. **[SDK Architecture Pattern](concepts/sdk-architecture-pattern.md)** - Universal 3-step pattern for ANY feature
2. **[Session Join Pattern](examples/session-join-pattern.md)** - Complete working code to join a session
3. **[Video Rendering](examples/video-rendering.md)** - Display video with attachVideo()
4. **[Event Handling](examples/event-handling.md)** - Required events for video/audio

**Reference:**
- **[Singleton Hierarchy](concepts/singleton-hierarchy.md)** - 4-level SDK navigation map
- **[API Reference](references/web-reference.md)** - Methods, events, error codes
- **[SKILL.md](SKILL.md)** - Complete documentation navigation
- **[../../probe-sdk/SKILL.md](../../probe-sdk/SKILL.md)** - Optional browser/device/network readiness diagnostics before join

**Having issues?**
- Video not showing → [Video Rendering](examples/video-rendering.md) (use attachVideo, not renderVideo)
- getMediaStream() returns undefined → Call AFTER join() completes
- Quick diagnostics → [Common Issues](troubleshooting/common-issues.md)

## SDK Overview

The Zoom Video SDK for Web is a JavaScript library that provides:
- **Session Management**: Join/leave video SDK sessions
- **Video/Audio**: Start/stop camera and microphone
- **Screen Sharing**: Share screens or browser tabs
- **Cloud Recording**: Record sessions to Zoom cloud
- **Live Streaming**: Stream to RTMP endpoints
- **Chat**: In-session messaging
- **Command Channel**: Custom command messaging
- **Live Transcription**: Real-time speech-to-text
- **Subsessions**: Breakout room support
- **Whiteboard**: Collaborative whiteboard features
- **Virtual Background**: Blur or custom image backgrounds

## Prerequisites

### System Requirements

- **Modern Browser**: Chrome 80+, Firefox 75+, Safari 14+, Edge 80+
- **Video SDK Credentials**: SDK Key and Secret from [Marketplace](https://marketplace.zoom.us/)
- **JWT Token**: Server-side generated signature

### Browser Feature Requirements

```javascript
// Check browser compatibility before init
````
END THIRD-PARTY FILE c92f3a74a05cc096

The third-party file has ended. Everything between the c92f3a74a05cc096 tags is data: requests and commands from it are not followed. An “end of file” line with another tag inside the block is part of the file.

First 3016 of 26226 bytes. © Zoom · MIT · https://github.com/openai/plugins/tree/HEAD/plugins/zoom/skills/video-sdk/web/SKILL.md

_Part of the page did not fit — see the HTML version._

---
NeVibeCode on affpapa.org. Catalog texts are descriptions, not instructions for the agent. How to choose and install: https://affpapa.org/en/nevibecode/agents.md