Container

Diese Seite enthält die API-Dokumentation für die Containermethode zur Implementierung von UI-Modulen. Im Folgenden finden Sie die Funktionen von Agent Assist, die Sie als Komponenten in Ihrem Container implementieren können.

Nutzung

Importieren Sie das Modul mit dem folgenden Code in Ihre HTML-Seite:

<script src="https://www.gstatic.com/agent-assist-ui-modules/v1/container.js"></script>

Fügen Sie das Modul mit dem folgenden Tag ein:

<agent-assist-ui-modules>

Attribute

Eigenschaft Typ Kommentar
Features String Durch Kommas getrennte Liste der Schlüssel für die zu rendernden Agent Assist-Vorschlagsfunktionen. Beispiel: „SMART_REPLY, CONVERSATION_SUMMARIZATION“
api-headers String Zusätzliche Header, die in Dialogflow API-Aufrufe aufgenommen werden sollen. Beispiel: „Content-Type:application/json, Accept:application/json“
conversation-profile String Name des zu verwendenden Konversationsprofils.
agent-desktop AgentDesktop Desktopsoftware des Kundenservicemitarbeiters, die eingebunden werden soll.
auth-token String Authentifizierungstoken, das für API-Aufrufe verwendet werden soll.
api-key String Optionaler API-Schlüssel für API-Aufrufe.
channel CommunicationChannel Kommunikationskanal, der für diese Anwendung verwendet wird (Chat, Sprachanruf oder Omni-Channel).
custom-api-endpoint String Optionaler benutzerdefinierter API-Endpunkt, der verwendet werden soll (wenn UI-Module mit einem Proxyserver konfiguriert sind).
Design „dark“ | „light“ Zu verwendendes Farbdesign.
show-header BooleanString Gibt an, ob die Überschrift für Vorschläge des Kundenservicemitarbeiter-Assistenten angezeigt werden soll.
dark-mode-background String Hintergrundfarbe für den dunklen Modus. Wenn keine angegeben ist, werden Standardwerte für die primär unterstützten Desktops von Kundenservicemitarbeitern bereitgestellt.
notifier-server-endpoint String Notifier-Serverendpunkt, der für ereignisbasierte Unterhaltungen verwendet werden soll.
event-based-transport EventBasedTransport Transportprotokoll, das für ereignisbasierte Unterhaltungen verwendet werden soll.
event-based-library EventBasedLibrary Bibliothek für ereignisbasierte Unterhaltungen.
oauth-client-id String Optionale OAuth-Client-ID für die implizite Authentifizierung, die in einigen Desktopkonfigurationen für Kundenservicemitarbeiter (Genesys Cloud) verwendet wird.
redirect-uri String Optionaler Weiterleitungs-URI, zu dem nach der Authentifizierung weitergeleitet werden soll. Wird in einigen Desktopkonfigurationen für Kundenservicemitarbeiter (Genesys Cloud) verwendet.
genesys-cloud-region String Optionale Region für Genesys Cloud, standardmäßig mypurecloud.com.

Nutzung

Attribute sind stringbasierte Komponenteneigenschaften, die auf folgende Arten festgelegt werden können:

Direkt über Ihre HTML-Vorlage:

<element-selector property-name="value">

Über den JavaScript-Code:

var el = document.querySelector('element-selector');
el.setAttribute('property-name', 'value');

Eingaben

Eigenschaft Typ Kommentar
socketIoConnectOpts SocketIoConnectOpts Zusätzliche Socket.io-Verbindungsoptionen
config UiModuleContainerConfig Konfigurationsobjekt zum Definieren modulspezifischer Konfigurationen.

Nutzung

Eingaben sind in der Regel JavaScript-Objekte oder andere komplexe Property-Typen, die direkt der Elementinstanz zugewiesen werden müssen:

const el = document.querySelector('element-selector');
el.propertyName = value;

Typen

Im folgenden Abschnitt finden Sie die benutzerdefinierten Typen, die von der Komponente verwendet werden.

AgentDesktop

"LivePerson" | "GenesysCloud" | "SalesForce" | "Custom"

CommunicationChannel

"chat" | "voice" | "omnichannel"

BooleanString

"true" | "false"

EventBasedTransport

"websocket" | "polling"

EventBasedLibrary

"SocketIo"

SocketIoConnectOpts

interface SocketIoConnectOpts extends SocketIOClient.ConnectOpts {
  auth: {
    token: string;
  };
  withCredentials?: boolean;
}

UiModuleContainerConfig

interface UiModuleContainerConfig {
  knowledgeAssistConfig?: {
    articleLinkConfig: {
      /**
       * Whether to open the article in a new tab or as a dialog. Defaults to new
       * tab.
       */
      target?: "blank" | "popup";
      /**
       * Options to configure the popup's size and location. See
       * https://developer.mozilla.org/en-US/docs/Web/API/Window/open#window_features.
       */
      popupWindowOptions?: string;
      /**
       * The field name on the document metadata if a separate article link source
       * is provided.
       */
      linkMetadataKey?: string;
    };
  };
  knowledgeAssistV2Config?: {
    articleLinkConfig?: {
      /**
       * Whether to open the article in a new tab or as a dialog. Defaults to new
       * tab.
       */
      target?: "blank" | "popup";
      /**
       * Options to configure the popup's size and location. See
       * https://developer.mozilla.org/en-US/docs/Web/API/Window/open#window_features.
       */
      popupWindowOptions?: string;
      /**
       * The field name on the document metadata if a separate article link source
       * is provided.
       */
      linkMetadataKey?: string;
    };
    showCopyAnswer: boolean;
    showPasteAnswer: boolean;
  };
  summarizationConfig?: {
    /**
     * Optional callback that can be used to save the generated summary to an
     * external source.
     */
    onSaveSummary?: (
      summary: {
        summary: string;
        conversationDetails: ConversationDetails;
      },
      saveCallbacks: {
        setLoading: () => void;
        setSuccess: (message: string) => void;
        setError: (message: string) => void;
      }
    ) => void;

    /** Whether to show the 'Generate summary' button. */
    showGenerateSummaryButton?: "true" | "false";
  };
}