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 ZoomCobrowseSDK:
import { ZoomCobrowseSDK } from '@zoom/cobrowsesdk/customer';
ZoomCobrowseSDK.init( settings Object, [ Callback Function ] )
This initializes the environment for ZoomCobrowseSDK, with settings based on the settings object. It tests for the required browser features and passes the result to the Callback function. Don't make any other API calls before Callback is called.
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 occurred>"
}
The following example initializes Cobrowse JS API:
ZoomCobrowseSDK.init(settings, function ({ success, session, error }) {
if (success) {
// ZoomCobrowseSDK is ready to use now
const sessionInfo = session.getSessionInfo();
if (sessionInfo.sessionStatus === 'session_recoverable') {
// autojoin session
session.join();
} else {
session.start({
sdkToken: '{SDK_TOKEN}',
});
}
} else {
console.log(error);
}
});
To use the ZoomCobrowseSDK JS API, you will first need to include our snippet on the webpages you want to be able to start Cobrowse from:
(function(r,a,b,f,c,d){r[f]=r[f]||{init:function(){r.ZoomCobrowseSDKInitArgs=arguments}};
var fragment=a.createDocumentFragment();
function loadJs(url) {c=a.createElement(b);d=a.getElementsByTagName(b)[0];
c.async=false;c.src=url;fragment.appendChild(c);};
loadJs('https://us01-zcb.zoom.us/static/resource/sdk/${sdkKey}/js/${SDK_VERSION}');
d.parentNode.insertBefore(fragment,d);})(window,document,'script','ZoomCobrowseSDK');
The snippet loads the necessary ZoomCobrowseSDK JS libraries. Once it is there, the ZoomCobrowseSDK.init() function will be immediately available.
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.
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 occurred>"
}
The following example initializes Cobrowse JS API:
ZoomCobrowseSDK.init(settings, function ({ success, session, error }) {
if (success) {
// ZoomCobrowseSDK is ready to use now
const sessionInfo = session.getSessionInfo();
if (sessionInfo.sessionStatus === 'session_recoverable') {
// autojoin session
session.join();
} else {
session.start({
sdkToken: '{SDK_TOKEN}',
});
}
} else {
console.log(error);
}
});
Bring Your Own PIN (BYOP) enables you to create custom PIN codes for cobrowse sessions. The PIN code must be between one and ten digits. To enable, add the enable_byop key with a value of 1 in the JWT payload when you create the session. Custom PINs can include only numbers, letters, or a combination of both. Letters can be in any case, but will be converted to uppercase. The number of characters is limited to no more than 10.
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 ZoomCobrowseAgentSDK:
import { ZoomCobrowseAgentSDK } from '@zoom/cobrowsesdk/agent';
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.
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 occurred>"
}
The following example initializes Cobrowse Agent JS API:
ZoomCobrowseAgentSDK.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);
}
});
The snippet loads the necessary ZoomCobrowseAgentSDK JS libraries. Once it is there, the ZoomCobrowseAgentSDK.init() function will be immediately available.
(function(r,a,b,f,c,d){r[f]=r[f]||{init:function(){r.ZoomCobrowseAgentSDKInitArgs=arguments}};
var fragment=a.createDocumentFragment();
function loadJs(url) {c=a.createElement(b);d=a.getElementsByTagName(b)[0];
c.async=false;c.src=url;fragment.appendChild(c);};
loadJs('https://us01-zcb.zoom.us/static/resource/sdk/${sdkKey}/agent/js');
d.parentNode.insertBefore(fragment,d);})(window,document,'script','ZoomCobrowseAgentSDK');
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.
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 occurred>"
}
The following example initializes Cobrowse Agent JS API:
ZoomCobrowseAgentSDK.init(settings, function ({ success, session, error }) {
if (success) {
session.createAgentViewerEndpoint(
{
pinCode: '{PIN_CODE}',
sdkToken: '{SDK_TOKEN}',
},
function ({ success, agentViewerUrl, error }) {
if (success) {
console.log(agentViewerUrl);
} else {
console.log(error);
}
}
);
} else {
console.log(error);
}
});