Zoom Cobrowse SDK for Web

This SDK is subject to Zoom's Terms of Use. It falls under the definitions of "SDK" and "SDK Service" as outlined in those terms.

The Zoom Cobrowse SDK enables users to share their web browsing experience with an organization without compromising privacy and security. Collaborators can annotate and see what is being shared. Certain parts of the screen can be masked or redacted from view by the user to protect their privacy and confidentiality. This offers a secure and advanced form of screen sharing, limited to one particular web site.

Customer

Installation

In your frontend project, install the Cobrowse SDK:

$ npm install @zoom/cobrowsesdk --save

In the component file where you want to use the Cobrowse SDK, import ZoomCobrowse:

import { ZoomCobrowseSDK } from '@zoom/cobrowsesdk/customer';

Usage

Initialize the API

ZoomCobrowseSDK.init( settings Object, [ Callback Function ] )

This initializes the environment for ZoomCobrowseSDK, the settings based on settings object, it tests required browser features, and passes the result to the Callback function. Don't make any other API calls before Callback is called.

Implement a callback function

Callback should be a function accepting one argument with the following structure:

{
"success": true | false,
"session": "<Zoom Cobrowse Session Instance>",
"error": "<error message or undefined if no error occured>"
}

Sample code

ZoomCobrowseSDK.init(settings, function ({ success, session, error }) {
  if (success) {
    const sessionInfo = session.getSessionInfo();

    if (sessionInfo.sessionStatus === 'session_recoverable') {
      session.join();
    } else {
      session.start({
        sdkToken: '{SDK_TOKEN}',
      });
    }
  } else {
    console.log(error);
  }
});

Agent

Installation

In your frontend project, install the Cobrowse SDK:

$ npm install @zoom/cobrowsesdk --save

In the component file where you want to use the Cobrowse SDK, import ZoomCobrowse:

import { ZoomCobrowseAgentSDK } from '@zoom/cobrowsesdk/agent';

Usage

This snippet loads the necessary ZoomCobrowseAgentSDK JS libraries. Once it is there, the ZoomCobrowseAgentSDK.init() function will be immediately available.

Initialize the API

ZoomCobrowseAgentSDK.init( settings Object, [ Callback Function ] )

This script initializes the ZoomCobrowseAgentSDK environment by defining a global object (ZoomCobrowseAgentSDK) and loading the SDK dynamically. It ensures that the necessary dependencies are available and verifies browser compatibility. Once loaded, it prepares the SDK for use by passing the initialization arguments to ZoomCobrowseAgentSDKInitArgs. Ensure no other API calls are made before the SDK has been fully initialized.

Implement a callback function

Callback should be a function accepting one argument with the following structure:

{
"success": true | false,
"session": "<Zoom Cobrowse Session Instance>",
"error": "<error message or undefined if no error occured>"
}

Sample code

ZoomAgentCobrowseSDK.init(settings, function ({ success, session, error }) {
  if (success) {
    const sessionInfo = session.getSessionInfo();

    if (sessionInfo.sessionStatus === 'session_recoverable') {
      session.join();
    } else {
      session.join({
        sdkToken: '{SDK_TOKEN}',
        pinCode: '{PIN_CODE}',
      });
    }
  } else {
    console.log(error);
  }
});

Session Parameters

Now we will start or join the session. Here are the required parameters for the session.start() or session.join() functions.

| Parameter | Parameter Description | | --------- | ------------------------------------------------------------------------------------------- | | token | Required, your Cobrowse SDK JWT. |

Then start or join the session and define the stream, which will be used for core features.

Core Features:

• Annotation
• Data masking

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

Open Source Software attribution