Contact Center Plugin - v3.9.0-next.23

Webex JS SDK: Contact Center Plugin

Welcome to @webex/contact-center, a plugin for the Webex JS SDK. This package enables integration with Webex Contact Center, providing APIs for agent management, task handling, and real-time communications.

Features

Agent lifecycle (login, state, profile)
Task operations (calls, chats, media)
Event-driven updates
WebRTC browser calling
TypeScript support

Installation

npm install @webex/contact-center

Initialization

Initialize the Contact Center plugin with the Webex SDK. The config parameter is optional, but you can pass any of the following options for cc:

import Webex from '@webex/contact-center';

const config = {
  credentials: {
    access_token: 'your-access-token', // Required for authentication
  },
  logger: {
    level: 'debug', // Enhanced logging for development
    bufferLogLevel: 'log', // Log level for uploaded logs
  },
  cc: {
    // Agent session management
    allowMultiLogin: false, // Prevent multiple agent sessions
    allowAutomatedRelogin: true, // Auto reconnect on disconnection

    // Connection settings
    clientType: 'WebexCCSDK', // Identify client type
    isKeepAliveEnabled: false, // Websocket keep-alive
    force: true, // Force connection parameters

    // Metrics configuration
    metrics: {
      clientName: 'WEBEX_JS_SDK',
      clientType: 'WebexCCSDK',
    },
  },
};

const webex = Webex.init({config}); // config is optional
const cc = webex.cc;

webex.once('ready', () => {
  // Safe to use cc and other plugins here
});

Core Classes

ContactCenter Class

The ContactCenter class is your primary interface for agent operations. Key capabilities include:

Session Management:
- Agent registration and initialization
- Connection management
- Event handling
Agent Operations:
- Station login/logout
- State management (Available/Idle)
- Profile updates
Task Management:
- Inbound task handling
- Outbound calling
- Queue operations

Example workflow:

// Initialize agent session
async function initializeAgent() {
  try {
    // 1. Register with contact center
    const profile = await cc.register();

    // 2. Login with browser-based calling
    await cc.stationLogin({
      teamId: profile.teams[0].teamId,
      loginOption: 'BROWSER',
    });

    // 3. Set availability state
    await cc.setAgentState({
      state: 'Available',
      auxCodeId: '0',
    });

    console.log('Agent initialized and ready');
  } catch (error) {
    console.error('Initialization failed:', error);
  }
}

Task Class

The Task class represents an interaction (call, chat, etc.) and provides methods for:

Media Control:
- Mute/unmute
- Hold/resume
- Recording controls
Call Flow:
- Accept/decline tasks
- Transfer operations
- Consultation features
Task Completion:
- End interaction
- Wrap-up handling
- Disposition updates

Example task handling:

// Set up task event handlers
cc.on('task:incoming', async (task) => {
  try {
    // 1. Accept the task
    await task.accept();

    // 2. Set up media handling (for voice)
    task.on('task:media', (track) => {
      const audio = document.getElementById('remote-audio');
      audio.srcObject = new MediaStream([track]);
    });

    // 3. Handle task states
    task.on('task:hold', () => {
      console.log('Task placed on hold');
    });

    task.on('task:end', async () => {
      if (task.data.wrapUpRequired) {
        await task.wrapup({
          auxCodeId: 'RESOLVED',
          wrapUpReason: 'Customer issue resolved',
        });
      }
    });
  } catch (error) {
    console.error('Task handling failed:', error);
  }
});

Configuration Reference

Option	Type	Default	Description
`credentials.access_token`	`string`	Required	Webex authentication token
`logger.level`	`string`	`'info'`	Log level (`'debug'`, `'info'`, `'warn'`, `'error'`)
`logger.bufferLogLevel`	`string`	`'log'`	Buffered logging level for diagnostics
`cc.allowMultiLogin`	`boolean`	`false`	Allow multiple concurrent logins
`cc.allowAutomatedRelogin`	`boolean`	`true`	Auto-reconnect on connection loss
`cc.clientType`	`string`	`'WebexCCSDK'`	Client identifier
`cc.isKeepAliveEnabled`	`boolean`	`false`	Enable websocket keep-alive
`cc.force`	`boolean`	`true`	Force connection parameters
`cc.metrics.clientName`	`string`	`'WEBEX_JS_SDK'`	Client name for metrics
`cc.metrics.clientType`	`string`	`'WebexCCSDK'`	Client type for metrics