Zoom Apps – Contact Center & Phone (ZCC & ZP) Example

This app demonstrates the Zoom Apps SDK: (1) user authentication and identification, (2) tracking ZCC and ZP SDK events, and (3) buttons to run ZCC and ZP SDK methods.

ZCC Engagement Tiles

This single webview tracks all engagements. The content below shows only the active engagement (the one in the foreground in the Zoom client).

The tiles below list engagements detected by this app. The active engagement (from onEngagementContextChange) is highlighted in green.

Engagement ID: {{engagementId}} Active
Queue: {{data.queueName}}
State: {{data.state}}
Channel: {{data.channel}}
Variables: {{getGlobalVariableCount(engagementId)}}
Consumer: {{data.consumerDisplayName}}
Email: {{data.consumerEmail}}
Number: {{data.consumerNumber}}
consumerId: {{data.consumerId}}


Active engagement

Detail for the engagement currently in the foreground in the Zoom client. Variables are loaded from the SDK per engagement and can be 0 or many.

Context
Engagement ID: {{ activeEngagementData().engagementId }}
Queue: {{ activeEngagementData().queueName }}
Start time: {{ activeEngagementData().startTime }}
Status
State: {{ activeEngagementData().state }}
Channel: {{ activeEngagementData().channel }}
Consumer: {{ activeEngagementData().consumerDisplayName }}
Email: {{ activeEngagementData().consumerEmail }}
Number: {{ activeEngagementData().consumerNumber }}
consumerId: {{ activeEngagementData().consumerId }}
Variables
NameValue
{{ name }}{{ val ?? 'null' }}

No variables for this engagement.

No active engagement. Waiting for engagement context from the Zoom client.


In a single webview, these APIs are typically used for the engagement that is in the foreground (active engagement). Run fetches from the SDK; the result below shows cached data for the active engagement when available.

APIs

APIs
makePhoneCall

APIs
Decrypted App Context

App context from the SDK is encrypted. Below is the decrypted object (requires backend).

{{JSON.stringify(DecryptedAppContext, undefined, 2)}}

Decrypting...

Misc APIs

{{event.source}} {{event.name}} {{ event.timestamp.toLocaleTimeString() }}
{{JSON.stringify(event.payload, undefined, 2)}}

Waiting for first event...

Use the authorize() function for in-client OAuth to get user details via the Zoom Marketplace API (/users/me).

User Data (from /users/me)
Name: {{zoomApiUserInfo.first_name}} {{zoomApiUserInfo.last_name}}
Email: {{zoomApiUserInfo.email}}
Account ID: {{zoomApiUserInfo.account_id}}
Account Number: {{zoomApiUserInfo.account_number}}

No user info retrieved yet.

This app calls authorize() on launch. Use the button to re-trigger.

Reference app for Zoom Apps SDK: user auth, ZCC and ZP events, and SDK methods. See Zoom Developer docs for support.

App loaded at {{timewhenapploaded}}

This app does not store data. It demonstrates the Zoom App SDK for authentication, event tracking, and API methods.