Funciones
Estas son las funciones que puede configurar en el SDK de Oracle Web.
Registros de hora absolutos y relativos
- Indicador de función:
timestampMode: 'relative' | 'absolute'
(valor por defecto:'relative'
) - Configuración de función:
timestampMode
Puede activar registros de hora absolutos o relativos para los mensajes de chat. Los registros de hora absolutos muestran la hora exacta de cada mensaje. Los registros de hora relativos solo se muestran en el último mensaje y expresan el tiempo en términos de segundos, días, horas, meses o años anteriores en relación con el mensaje anterior.
Descripción de la ilustración relativa-v-absolute-timestamps.png
La precisión Los registros de hora absolutos los hacen ideales para tareas de archivado, pero dentro del contexto limitado de una sesión de chat, esta precisión empeora la experiencia de usuario porque los usuarios deben comparar los registros de hora para averiguar el paso del tiempo entre mensajes. Los registros de hora relativos permiten a los usuarios realizar un seguimiento de la conversación fácilmente con términos como Ahora mismo y Hace unos momentos que se pueden comprender inmediatamente. Los registros de hora relativos mejoran la experiencia del usuario de otra forma, al tiempo que simplifican las tareas de desarrollo: debido a que los registros de hora relativos marcan los mensajes en términos de segundos, días, horas, meses o años transcurridos, no es necesario convertirlos para las zonas horarias.
Comportamiento de los registros de hora relativos
timestampMode: 'relative'
o timestampMode: 'default'
), se muestra un registro de hora absoluto antes del primer mensaje del día como cabecera. Esta cabecera aparece cuando la conversación no se haya borrado y los mensajes más antiguos sigan estando disponibles en el historial. A continuación, se muestra un registro de hora relativo en cada mensaje nuevo.

Descripción de la ilustración most-recent-message-timestamp.png
Este registro de hora se actualiza a intervalos regulares (segundos, minutos, etc.) hasta que se recibe un mensaje nuevo.
- Para los primeros 10
- Entre 10 y 60
- Cada minuto entre 1 min y 60 min
- Cada hora entre 1 h y 24 h
- Cada día entre 1d-30d
- Cada mes entre 1 m y 12 m
- Cada año después del primer año
Adición de un registro de hora relativo
- Active los registros de hora relativos:
timestampMode: 'relative'
- Pasos opcionales:
- Defina el color del registro de hora relativo:
timestamp
: '<a hexadecimal color value>
' - Para las aptitudes multilingües, localice el texto del registro de hora mediante estas claves:
Clave Texto por defecto Descripción relTimeNow
Now
Registro de hora inicial, que se muestra durante los 9 primeros segundos. Este registro de hora también se muestra cuando se restablece la conversación. relTimeMoment
a few moments ago
Se muestra entre 10 y 60 segundos. relTimeMin
{0}min ago
Se actualiza cada minuto relTimeHr
{0}hr ago
Se actualiza cada hora relTimeDay
{0}d ago
Se actualiza todos los días durante el primer mes. relTimeMon
{0}mth ago
Se actualiza cada mes durante los doce primeros meses. relTimeYr
{0}yr ago
Se actualiza cada año. - Utilice la configuración
timeStampFormat
para cambiar el formato del registro de hora absoluto que se muestra antes del primer mensaje de cada día.
- Defina el color del registro de hora relativo:
Terminación automática
- Indicador de función:
enableAutocomplete: true
(valor por defecto:false
) - Active el almacenamiento en caché de cliente:
enableAutocompleteClientCache
enableAutocomplete: true
y agregue un juego de mensajes de usuario optimizados a la página Crear intención. Una vez activado, una ventana emergente muestra estos mensajes después de que los usuarios introduzcan tres o más caracteres. Las palabras de los mensajes sugeridos que coinciden con la entrada del usuario se definen en negrita. Desde allí, los usuarios pueden introducir su propia entrada, o bien optar por uno de los mensajes de terminación automática en su lugar.
Esta función solo está disponible en WebSocket.
Cuando un asistente digital está asociado al canal web de Oracle, todas las expresiones de ejemplo configuradas para cualquiera de las aptitudes registradas en ese asistente digital se pueden utilizar como sugerencias de terminación automática.
Envío automático de un campo
Cuando un campo tiene la propiedad autoSubmit
definida en true
, el cliente envía un valor FormSubmissionMessagePayload
con la asignación submittedField
que contiene los valores de campo válidos que se han introducido hasta ahora. Los campos que aún no se hayan definido (independientemente de si son obligatorios) o los campos que violan una validación del lado del cliente no se incluyen en la asignación submittedField
. Si el campo de envío automático en sí contiene un valor que no es válido, el mensaje de envío no se envía y se muestra el mensaje de error del cliente para ese campo en particular. Cuando un envío automático se realiza correctamente, el valor partialSubmitField
del mensaje de envío de formulario se definirá en id
del campo autoSubmit
.
Sustitución de un formulario de entrada anterior
Cuando el usuario final envía el formulario, ya sea porque un campo tiene autosubmit
definido en true
, la aptitud puede enviar un nuevo EditFormMessagePayload
. Este mensaje debe sustituir al mensaje del formulario de entrada anterior. Al definir la propiedad de extensión de canal replaceMessage
en true
, puede activar el SDK para sustituir el mensaje de formulario de entrada anterior por el mensaje de formulario de entrada actual.
Diseño RTL automático
Cuando la dirección base de la página host se define con <html dir="rtl">
para admitir los idiomas que se escriben de derecha a izquierda (RTL), el widget de chat se presenta automáticamente a la izquierda. Debido a que el widget está alineado a la izquierda para idiomas que se escriben de derecha a izquierda, sus iconos y elementos de texto también se vuelven a colocar. Los iconos están en las posiciones opuestas desde donde estarían en una representación de izquierda a derecha (LTR). Por ejemplo, los iconos de envío, micrófono y anexo se giran de forma que los iconos de envío y micrófono ocupen el lado izquierdo del campo de introducción de datos (con el icono de envío direccional apuntando a la izquierda) mientras que el icono de anexo está en el lado derecho del campo de introducción de datos. La alineación de los elementos de texto, como inputPlaceholder
y chatTitle
, se basa en si el idioma del texto es LTR o RTL. Para los idiomas RTL, el texto de inputPlaceHolder y chatTitle aparecen en la parte derecha del campo de entrada.
Avatares
avatarBot
: URL del origen de la imagen o cadena de origen de la imagen SVG que se muestra junto a los mensajes de aptitud.avatarUser
: URL del origen de la imagen o cadena de origen de la imagen SVG que se muestra junto a los mensajes de usuario. Además, si la aptitud tiene una integración de agente en directo, el SDK se puede configurar para que muestre un icono diferente para los mensajes de agente.avatarAgent
: URL del origen de la imagen o cadena de origen de la imagen SVG que se muestra junto a los mensajes del agente. Si no se proporciona este valor, pero se defineavatarBot
, se utiliza el iconoavatarBot
en su lugar.
Estos valores solo se pueden transferir en la configuración de inicialización. No se pueden modificar de forma dinámica.
new WebSDK({
URI: '<URI>',
//...,
icons: {
avatarBot: '../assets/images/avatar-bot.png',
avatarUser: '../assets/images/avatar-user.jpg',
avatarAgent: '<svg xmlns="http://www.w3.org/2000/svg" height="24" width="24"><path d="M12 6c1.1 0 2 .9 2 2s-.9 2-2 2-2-.9-2-2 .9-2 2-2m0 9c2.7 0 5.8 1.29 6 2v1H6v-.99c.2-.72 3.3-2.01 6-2.01m0-11C9.79 4 8 5.79 8 8s1.79 4 4 4 4-1.79 4-4-1.79-4-4-4zm0 9c-2.67 0-8 1.34-8 4v3h16v-3c0-2.66-5.33-4-8-4z"/></svg>'
}
})
Sincronización de conversaciones de matriz
Indicador de función: enableTabsSync: true
(valor por defecto: true
)
Los usuarios pueden necesitar abrir el sitio web en varias pestañas por varias razones. Con enableTabsSync: true
, puede sincronizar y continuar la conversación del usuario desde cualquier separador, siempre que los parámetros de conexión (URI
, channelId
y userId
) sean los mismos en todos los separadores. Esta función garantiza que los usuarios puedan ver los mensajes de la aptitud en cualquier separador y responder desde el mismo separador o cualquier otro. Además, si el usuario borra el historial de conversaciones en una ficha, también se eliminará de las otras fichas. Si el usuario actualiza el idioma del chat en un separador, el idioma del chat se sincroniza con los otros separadores.
- Un nuevo separador se sincroniza con los separadores existentes para los nuevos mensajes entre el usuario y la aptitud al abrir. Si no ha configurado el SDK para mostrar mensajes del historial de conversaciones, el widget de chat inicial en el nuevo separador aparecerá vacío cuando se abra.
- Si ha configurado el SDK para que muestre el historial de conversaciones, los mensajes del chat actual en los separadores existentes aparecerán como parte del historial de conversaciones en un separador nuevo. Si se define
disablePastActions
enall
opostback
, puede evitar la interacción con las acciones de los mensajes en el nuevo separador. - El navegador Safari actualmente no admite esta función.
Representación de Mensajes Personalizados
Indicador de función: delegate.render: (message) => boolean (default: undefined)
render
delegate, que toma el modelo de mensaje como entrada y devuelve un indicador booleano como salida. Debe devolver true
para sustituir la representación por defecto por la representación personalizada para un tipo de mensaje concreto. Si se devuelve false
, el mensaje por defecto se representa en su lugar.
Para la representación personalizada, toda la manipulación de clics de acción y la desactivación o activación de la acción se deben manejar de forma explícita.
samples
del SDK para comprobar cómo puede utilizar esta función con marcos como React, Angular y Oracle JavaScript Extension Toolkit (JET).
Respuestas de cliente predeterminadas
Indicador de función: enableDefaultClientResponse: true
(valor por defecto: false
)
Utilice este indicador para proporcionar respuestas por defecto del lado del cliente junto con un indicador de escritura cuando la respuesta de aptitud se haya retrasado o cuando no haya ninguna respuesta de aptitud. Si el usuario envía el primer mensaje/consulta, pero la aptitud no responde en el número de segundos definido por el indicador defaultGreetingTimeout
, la aptitud puede mostrar un mensaje de saludo que se configura mediante la cadena de traducción defaultGreetingMessage
. A continuación, el cliente vuelve a comprobar la respuesta de la aptitud. El cliente muestra la respuesta de la aptitud si se ha recibido, pero si no, muestra un mensaje de espera (configurado con la cadena de traducción defaultWaitMessage
) en intervalos definidos por defaultWaitMessageInterval
. Cuando la espera de la respuesta de la aptitud supera el umbral definido por el indicador typingIndicatorTimeout
, el cliente muestra una respuesta de disculpa al usuario y detiene el indicador de escritura. Puede configurar la respuesta de disculpa mediante la cadena de traducción defaultSorryMessage
.
Delegación
Configuración de función: delegate
delegate
o utilice el método setDelegate
. El objeto delegado puede contener opcionalmente las funciones delegadas beforeDisplay
, beforeSend
, beforePostbackSend
, beforeEndConversation
y render
.var delegate = {
beforeDisplay: function(message) {
return message;
},
beforeSend: function(message) {
return message;
},
beforePostbackSend: function(postback) {
return postback;
},
beforeEndConversation: function(message) {
return new Promise((resolve, reject) => {
setTimeout(() => {
resolve(message);
}, 2000);
});
},
render: function(message) {
if (message.messagePayload.type === 'card') {
// Perform custom rendering for card using msgId
return true;
}
return false;
}
}
beforeDisplay
El delegado beforeDisplay
permite modificar el mensaje de una aptitud antes de que se muestre en la conversación. El mensaje devuelto por el delegado se muestra en lugar del mensaje original. El mensaje devuelto no se muestra si el delegado devuelve un valor false como null
, undefined
o false
. Si se produce un error en el delegado, se mostrará el mensaje original en lugar del mensaje devuelto por el delegado. Utilice el delegado beforeDisplay
para aplicar selectivamente el comportamiento de enlace de vista web en el widget.
beforeSend
El delegado beforeSend
permite modificar un mensaje de usuario antes de enviarlo al servidor de chat como parte de sendMessage
. El mensaje que devuelve el delegado se envía a la aptitud en lugar del mensaje original. El mensaje devuelto por el delegado no se define si el delegado devuelve un valor false como null
, undefined
o false
, entonces el mensaje no se envía. Si se produce un error, el mensaje original se enviará en lugar del mensaje devuelto por el delegado.
beforePostbackSend
El delegado beforePostbackSend
es similar a beforeSend
, solo que aplicado a los mensajes de devolución del usuario. Devolución del delegado que se envía a la aptitud. Si devuelve un valor falsy, como null
, undefined
o false
, no se envía ningún mensaje.
beforeEndConversation
beforeEndConversation
permite una intercepción al final de un flujo de conversación si se debe realizar alguna actividad previa a la salida. function
recibe el mensaje de salida como parámetro de entrada y debe devolver un valor Promise
. Si este Promise
se resuelve con el mensaje de salida, el mensaje de salida CloseSession
se envía al servidor de chat. De lo contrario, no se podrá enviar el mensaje de salida....
beforeEndConversation: function(message) {
return new Promise((resolve, reject) => {
setTimeout(() => {
resolve(message);
}, 2000);
});
}
render
El delegado render
permite sustituir la representación de mensajes por defecto. Si la función de delegado render
devuelve true
para un tipo de mensaje concreto, WebSDK crea un espacio de marcador de posición en lugar de la representación de mensaje por defecto. Para identificar el marcador de posición, agregue el msgId
del mensaje como el id
del elemento. En la función de delegado render
, puede utilizar este identificador para obtener la referencia del marcador de posición y representar la plantilla de mensaje personalizada. Consulte Renderización de Mensajes Personalizados.
Widget y botón de inicio arrastrable
Indicador de función: enableDraggableButton: true
(valor por defecto: false
)
A veces, especialmente en dispositivos móviles donde el tamaño de la pantalla es limitado, el widget de chat o el botón de inicio pueden bloquear el contenido en una página web. Al definir enableDraggableButton: true
, puede permitir a los usuarios retirar el widget o el botón de inicio cuando esté bloqueando la vista. Este indicador solo afecta a la ubicación del botón de inicio, no al widget de chat: el widget seguirá abierto desde su ubicación original.
Indicador de escritura dinámica
Indicador de función: showTypingIndicator: 'true'
Un indicador de escritura indica a los usuarios que se abstengan de enviar un mensaje porque la aptitud está preparando una respuesta. Por defecto, las aptitudes muestran el indicador de escritura solo para su primera respuesta cuando se inicializa el SDK con showTypingIndicator: 'true'
. Para una experiencia de usuario óptima, la aptitud debe tener un indicador de escritura dinámica, que es un indicador de escritura que se muestra después de cada respuesta de la aptitud. Además de hacer saber a los usuarios que la aptitud no ha sufrido un timeout, sino que sigue trabajando activamente en una respuesta, la visualización del indicador de escritura después de cada respuesta de la aptitud garantiza que los usuarios no intentarán enviar mensajes de forma prematura, como puede ser el caso cuando la propiedad keepTurn
indica a la aptitud que responda con una serie de mensajes separados que no permitan al usuario interponer una respuesta.
- Inicialice el SDK con
showTypingIndicator
definido entrue
. - Llame a la API
showTypingIndicator
showTypingIndicator
solo puede activar la visualización del indicador de escritura dinámica cuando:
- El widget está conectado al servidor de chat de Oracle. El indicador de escritura dinámica no aparece cuando se cierre la conexión.
- El SDK se ha inicializado con
showTypingIndicator
definido entrue
.Nota
Esta API no puede funcionar cuando se utiliza el SDK en modo sin cabecera.
typingIndicatorTimeout
, que tiene un valor por defecto de 20 segundos. Si se llama a la API mientras se muestra un indicador de escritura, se restablece el temporizador y se oculta el indicador.
El indicador de escritura desaparece tan pronto como el usuario recibe los mensajes de la aptitud. El indicador de escritura se mueve a la parte inferior de la ventana del chat si un usuario introduce un mensaje o carga un anexo o envía una ubicación mientras se muestra.
Control del comportamiento de los enlaces embebidos
- Manejo personalizado:
linkHandler: { onclick: <function>, target: '<string>' }
- En la vista web en el widget:
linkHandler: { target: 'oda-chat-webview' }
- En una ventana nueva:
openLinksInNewWindow: 'true'
openLinksInNewWindow: true
o el comportamiento por defecto de abrir enlaces en una nueva pestaña, también puede abrir enlaces que se superpongan a la página web del widget. Para activar esta y otras sustituciones en el comportamiento de los enlaces, inicialice el SDK con
linkHandler: {
target: '_blank', // open link in a new page
onclick: (event) => { // some operation }
}
Utilice linkHander
para:
- Controle la navegación
iframe
para que pueda continuar superponiendo la página sin tener que incluir el widget en cada página, reabriéndola al navegar y manteniendo el mismo ID de usuario. - Abra algunos enlaces en una nueva ventana, mientras abre otros en la misma pestaña.
- Realizando una acción cuando se hace clic en un enlace.
- Evitando que se abra un enlace
- Abrir un enlace en una vista web.
openLinksInNewWindow
, debe definir uno de estos atributos o ambos:
self
: contexto de exploración actualtarget
: nombra el contexto de la ubicación de exploración, como una pestaña, una ventana oiFrame
. Defina la ubicacióniFrame
como el atributotarget
de un elemento de anclaje (<a>
). Puede definir los atributos_self
,_blank
,_parent
y_top
del destino.onclick
: acepta una función de devolución de llamada a la que se llama cuando se hace clic en el enlace. En la devolución de llamada se transfiereMouseEvent
que se recibe al hacer clic y se puede utilizar para realizar una acción, o incluso evitar que se abra el enlace.
Modo integrado
- Indicador de función:
embedded: true
(valor por defecto:false
) - Transfiera el ID del elemento de contenedor de destino:
targetElement
- Agregando
embedded: true
. - Definiendo la propiedad
targetElement
con el ID del elemento DOM (un componente HTML) que se utiliza como contenedor del widget (como'container-div'
en el siguiente fragmento).
<head>
<meta charset="utf-8">
<title>Oracle Web SDK Sample</title>
<script src="scripts/settings.js"></script>
<script>
var chatWidgetSettings = {
URI: YOUR_URI,
channelId: YOUR_CHANNELID,
embedded: true,
targetElement: 'container-div'
...
</script>
</head>
<body>
<h3 align="center">The Widget Is Embedded Here!</h3>
</body>
<div id="container-div"
style="height: 600px; width: 380px; padding: 0; text-align: initial">
</div>
El widget ocupa la anchura y la altura completas del contenedor. Si el contenedor no lo puede alojar, el widget no se mostrará en la página.
Finalizar sesión de conversación
Indicador de función: enableEndConversation: true
(valor por defecto: true
)
A partir de la versión 21.12, el SDK agrega un botón de cierre a la cabecera del widget de chat por defecto (enableEndConversation: true
) que permite a los usuarios finalizar la sesión actual.
endConversationConfirmMessage
y endConversationDescription
. Cuando un usuario descarta la petición de datos haciendo clic en Sí, el SDK envía a la aptitud un mensaje de evento que marca la sesión de conversación actual como finalizada. A continuación, la instancia se desconecta de la aptitud, reduce el widget de chat y borra el historial de conversaciones del usuario actual. También genera un evento chatend
para el que puede registrarse:Bots.on('chatend', function() {
console.log('The conversation is ended.');
});
Al abrir el widget de chat después, se inicia una nueva sesión de conversación.También puede terminar una sesión llamando al método
Bots.endChat()
(que se describe en la referencia que acompaña al SDK de Oracle Web que está disponible en la página Descargas). La llamada a este método puede resultar útil cuando el SDK se inicializa en el modo sin cabecera.
Enfoque en la primera acción de un mensaje
Indicador de función: focusOnNewMessage: 'action'
(valor por defecto: 'input'
)
Para los usuarios que prefieren la navegación basada en teclado (donde se incluyen los usuarios avanzados), puede cambiar el enfoque del campo de introducción de datos del usuario al primer botón de acción (o más a la izquierda) de un mensaje. Por defecto, el widget de chat devuelve el enfoque al campo de introducción de datos del usuario con cada mensaje nuevo (focusOnNewMessage: 'input'
). Esto es adecuado para los flujos de diálogo que esperan que el usuario introduzca mucho texto, pero cuando el flujo de diálogo contiene una serie de mensajes con acciones, los usuarios solo pueden seleccionar estas acciones mediante el uso de mouse o el retroceso por los separadores. Para este caso de uso, puede cambiar el enfoque al primer botón de acción del mensaje de aptitud cuando se recibe definiendo focusOnNewMessage: 'action'
. Si el mensaje no contiene ninguna acción, el enfoque se define en el campo de introducción de datos del usuario.
Accesos directos de teclado y teclas de acceso directo
hotkeys
, puede crear métodos abreviados de combinación de teclas Alt que activen o cambien el enfoque a elementos de interfaz de usuario en el widget de chat. Los usuarios pueden ejecutar estos accesos directos en lugar de usar el mouse o los gestos táctiles. Por ejemplo, los usuarios pueden introducir Alt + L para iniciar el widget de chat y Alt + C para contraerlo. Las teclas del teclado se asignan a los elementos mediante los pares clave-valor del objeto hotkeys
. Por ejemplo:
var settings = {
// ...,
hotkeys: {
collapse: 'c', // Usage: press Alt + C to collapse the chat widget when chat widget is expanded
launch: 'l' // Usage: press Alt + L to launch the chat widget when chat widget is collapsed
}
};
Al crear estos pares clave-valor:- Solo puede pasar una sola letra o dígito para una clave.
- Solo puede usar las teclas de teclado a-z y 0-9 como valores.
El atributo no es sensible a minúsculas.
Clave | Elemento |
---|---|
clearHistory |
Botón que borra el historial de conversaciones. |
close |
Botón que cierra el widget de chat y finaliza la conversación. |
collapse |
Botón que reduce el widget de chat ampliado. |
input |
Campo de entrada de texto en el pie de página del chat |
keyboard |
Botón que cambia el modo de entrada de voz a texto. |
language |
Menú de selección que muestra la lista de selección de idioma. |
launch |
Botón de inicio del widget de chat |
mic |
Botón que cambia el modo de entrada de texto a voz. |
send |
Botón que envía el texto de entrada a la aptitud. |
shareMenu |
El botón del menú Compartir en el pie de página del chat |
shareMenuAudio |
La opción de menú en la ventana emergente del menú Compartir que selecciona un archivo de audio para compartir. |
shareMenuFile |
La opción de menú en la ventana emergente del menú Compartir que selecciona un archivo genérico para compartir |
shareMenuLocation |
La opción de menú de la ventana emergente del menú Compartir que selecciona la ubicación del usuario para compartir. |
shareMenuVisual |
La opción de menú de la ventana emergente del menú Compartir que selecciona un archivo de imagen o de vídeo para compartir. |
SDK desatendido
Indicador de función: enableHeadless: true
(valor por defecto: false
)
enableHeadless: true
en la configuración inicial. La comunicación se puede implantar de la siguiente manera:
- Envío de mensajes: llama a
Bots.sendMessage(message)
para transferir cualquier carga útil al servidor. - Recepción de mensajes: las respuestas se pueden enumerar para utilizar
Bots.on('message:received', <messageReceivedCallbackFunction>)
. - Obtención de la actualización del estado de conexión: recibe actualizaciones sobre el estado de la conexión con
Bots.on('networkstatuschange', <networkStatusCallbackFunction>)
. La devolución de llamada tiene un parámetro de estado que se actualiza con los valores de 0 a 3, cada uno de los cuales se asigna a estados de WebSocket:0
:WebSocket.CONNECTING
1
:WebSocket.OPEN
2
:WebSocket.CLOSING
3
:WebSocket.CLOSED
- Devolver sugerencias para una consulta: devuelve una promesa que se resuelve en las sugerencias para la cadena de consulta proporcionada. La promesa se rechaza si tarda demasiado (aproximadamente 10 segundos) en recuperar la sugerencia.
Bots.getSuggestions(utterance) .then((suggestions) => { const suggestionString = suggestions.toString(); console.log('The suggestions are: ', suggestionString); }) .catch((reason) => { console.log('Suggestion request failed', reason); });
Nota
Para utilizar esta API, debe activar el finalizado automático (
) y configurar el finalizado automático para las intenciones.enableAutocomplete: true
Chat multilingüe
El soporte de idioma nativo del SDK web permite al widget de chat detectar el idioma de un usuario o permitir a los usuarios seleccionar el idioma de conversación. Los usuarios pueden cambiar entre idiomas, pero solo entre conversaciones, no durante una conversación porque la conversación se restablece cada vez que un usuario selecciona un nuevo idioma.
Activar el menú de idioma
multiLangChat
con un objeto que contenga la matriz supportedLangs
, que está compuesta por etiquetas de idioma (lang
) y etiquetas de visualización opcionales (label
). Fuera de esta matriz, también puede definir el idioma por defecto con la clave primary
(primary: 'en'
en el siguiente fragmento).multiLangChat: {
supportedLangs: [{
lang: 'en'
}, {
lang: 'es',
label: 'Español'
}, {
lang: 'fr',
label: 'Français'
}, {
lang: 'hi',
label: 'हिंदी'
}],
primary: 'en'
}
El widget de chat muestra los idiomas soportados transferidos en un menú desplegable ubicado en la cabecera. Además de los idiomas disponibles, el menú también incluye una opción Detectar idioma. Cuando un usuario selecciona un idioma de este menú, se restablece la conversación actual y se inicia una nueva conversación con el idioma seleccionado. El idioma seleccionado por el usuario se mantiene entre las sesiones en el mismo explorador, por lo que el idioma anterior del usuario se selecciona automáticamente cuando el usuario vuelve a revisar la aptitud a través de la página que contiene el widget de chat.
Consejo:
Puede agregar un listener de evento para el eventochatlanguagechange
(que se describe en la referencia que acompaña al SDK de Oracle Web que está disponible en la página Descargas), que se dispara cuando se selecciona un idioma de chat en el menú desplegable o se cambia.Bots.on('chatlanguagechange', function(language) {
console.log('The selected chat language is', language);
});
- Debe definir un mínimo de dos idiomas para permitir que se muestre el menú desplegable.
- La clave
label
es opcional para los idiomas soportados originalmente:fr
se muestra como Francés en el menú,es
se muestra como Español, y así sucesivamente. - Las etiquetas de los idiomas se pueden definir dinámicamente transfiriendo las etiquetas con el valor
i18n
. Puede definir la etiqueta para cualquier idioma transfiriéndola a su clavelanguage_<languageTag>
. Este patrón permite definir etiquetas para cualquier idioma, soportadas o no soportadas, y también permite traducciones de la etiqueta en distintas configuraciones regionales. Por ejemplo:
Si la propiedadi18n: { en: { langauge_de: 'German', language_en: 'English', language_sw: 'Swahili', language_tr: 'Turkish' }, de: { langauge_de: 'Deutsche', language_en: 'Englisch', language_sw: 'Swahili', language_tr: 'Türkisch' } }
i18n
incluye cadenas de traducción para el idioma seleccionado, el texto para campos como el marcador de posición de entrada, el título de chat, el texto de desplazamiento para botones y los títulos de pistas cambian automáticamente al idioma seleccionado. El texto del campo solo se puede cambiar a un idioma diferente cuando haya cadenas de traducción para el idioma seleccionado. Si no existen dichas cadenas, el idioma del texto del campo no cambia. - El widget detecta automáticamente el idioma en el perfil de usuario y activa la opción Detectar idioma si omite la clave
primary
. - Si bien
label
es opcional, si ha agregado un idioma que no es uno de los idiomas soportados originalmente, debe agregar una etiqueta para identificar la etiqueta, especialmente cuando no hay ninguna cadena i18n para el idioma. Por ejemplo, si no definelabel: 'हिंदी'
, paralang: hi
, el menú desplegable muestra hi en su lugar, contribuyendo a una experiencia de usuario deficiente.
Desactivar menú de idioma
A partir de la versión 21.12, también puede configurar y actualizar el idioma del chat sin tener que configurar también el menú desplegable de selección de idioma pasando multiLangChat.primary
en la configuración inicial sin pasar también una matriz multiLangChat.supportedLangs
. El valor transferido en la variable primary
se define como el idioma de chat para la conversación.
Detección de idioma
Si omite la clave
primary
, el widget detecta automáticamente el idioma en el perfil de usuario y activa la opción Detectar idioma en el menú.
Puede actualizar dinámicamente el idioma seleccionado llamando a la API setPrimaryChatLanguage(lang)
. Si el valor de lang
transferido coincide con uno de los idiomas soportados, se selecciona ese idioma. Cuando no se encuentra ninguna coincidencia, se activa Detectar idioma. También puede activar la opción Idioma detectado llamando a la API setPrimaryChatLanguage('und')
, donde 'und'
indica que no está determinado o transfiriendo multiLangChat: {primary: null}
o multiLangChat: {primary: 'und'}
.
setPrimaryChatLanguage(lang)
incluso cuando el menú desplegable no se haya configurado. Por ejemplo:Bots.setPrimaryChatLanguage('fr')
Puede actualizar el idioma de forma dinámica independientemente de si el idioma de chat está configurado inicialmente o no.El reconocimiento de voz, cuando se configura, está disponible cuando los usuarios seleccionan un idioma soportado. No está disponible cuando se configura la opción Detectar idioma. Al seleccionar un idioma que no esté soportado por el reconocimiento de voz, se desactiva la funcionalidad de reconocimiento hasta que se seleccione un idioma soportado.
Referencia rápida de chat multilingüe
Para ello... | ... Realice esta acción |
---|---|
Muestre la lista desplegable de selección de idioma a los usuarios finales. | Transfiera multiLangChat.supportedLangs .
|
Defina el idioma del chat sin mostrar el menú desplegable de selección de idioma a los usuarios finales. | Transfiera multiLangChat.primary .
|
Defina un idioma por defecto. | Transfiera multiLangChat.primary con multiLangChat.supportedLangs . El valor primary debe ser uno de los idiomas soportados que incluye la matriz.
|
Activar detección de idioma | Transfiera primary: null o primary: 'und' con multiLangChat .
|
Actualice dinámicamente el idioma del chat. | Llame a la API setPrimaryChatLanguage(lang) .
|
Vista web en widget
Puede configurar el comportamiento del enlace en los mensajes de chat para permitir a los usuarios acceder a páginas web desde dentro del widget de chat. En lugar de tener que cambiar de la conversación para ver una página en un separador o en una ventana del explorador independiente, un usuario puede permanecer en el chat porque el widget de chat abre el enlace dentro de una vista web.
Configuración del comportamiento de enlace a la vista web
- Para abrir todos los enlaces de la vista web, transfiera
linkHandler: { target: 'oda-chat-webview' }
en la configuración. De esta forma se define el destino de todos los enlaces enoda-chat-webview
, que es el nombre deiframe
en la vista web. - Para abrir solo determinados enlaces en la vista web, a la vez que se garantiza que otros enlaces se abran normalmente en otros separadores o ventanas, utilice el delegado
beforeDisplay
. Para abrir una acción de URL de mensaje específica en la vista web, sustituya el valor'url'
del campoaction.type
por'webview'
. Cuando el tipo de acción es'webview'
en la funciónbeforeDisplay
, el botón de acción abrirá el enlace en la vista web al hacer clic en él.
Apertura de enlaces desde dentro de la vista web
Los enlaces embebidos en una página que se muestra dentro de la vista web solo se pueden abrir dentro de ella cuando se conviertan en un elemento de anclaje (<a>
), con un atributo target definido como target="oda-chat-webview"
.
Personalice WebView
webViewConfig
que acepta un objeto. Por ejemplo:{ referrerPolicy: 'no-referrer-when-downgrade', closeButtonType: 'icon', size: 'tall'
Los campos de este objeto son opcionales. La configuración también se puede actualizar dinámicamente transfiriendo un objeto
webViewConfig
en el método setWebViewConfig
. Cada propiedad del objeto es opcional.
Campo | Valor | Descripción |
---|---|---|
accessibilityTitle
|
Cadena | Nombre del elemento de marco de vista web para la accesibilidad web. |
closeButtonIcon
|
Cadena | Cadena URL de imagen/SVG que se utiliza para mostrar el icono del botón de cierre. |
closeButtonLabel
|
Cadena | Etiqueta de texto/título de pista para el botón de cierre. |
closeButtonType
|
|
Define cómo se muestra el botón de cierre en la vista web. |
referrerPolicy
|
ReferrerPolicy
|
Indica el sitio de referencia que se debe enviar al recuperar el recurso del marco. El valor de la política referrerPolicy debe ser una directiva válida. La política por defecto aplicada es 'no-referrer-when-downgrade' .
|
sandbox
|
Matriz de cadena | Matriz de cadenas de restricción válidas que permite la exclusión de determinadas acciones dentro del marco. Las restricciones que se pueden transferir a este campo se incluyen en la descripción del atributo sandbox en MDN Web Docs.
|
size
|
|
Altura de la vista web en comparación con la altura del widget de chat. Cuando se define en 'tall' , se define como el 80% de la altura del widget, cuando se define en 'full' , es igual a la altura del widget.
|
title
|
Cadena | Título que se muestra en la cabecera del contenedor de vista web. |
- Las páginas que proporcionan la cabecera de respuesta
X-frame-options: deny
oX-frame-options: sameorigin
no se pueden abrir en la vista web debido a restricciones del servidor que impiden que la página se abra dentro de iframes. En estos casos, la vista web presenta el enlace de nuevo al usuario para que pueda abrirlo en una nueva ventana o separador. - Debido a las restricciones del servidor, las páginas de autorización no se pueden abrir dentro de WebViews, ya que las páginas de autorización siempre devuelven
X-frame-options: deny
para evitar un ataque de secuestro de clics. - Enlaces externos, que no se pueden abrir correctamente en la vista web. Solo los enlaces embebidos en los mensajes de la conversación se pueden abrir en la vista web.
Nota
Dado que los mensajes externos son incompatibles con la vista web, no dirija ningún enlace externo para que se abra en la vista web.
webViewErrorInfoText
i18n:settings = {
URI: 'instance',
//...,
i18n: {
en: {
webViewErrorInfoText: 'This link can not be opened here. You can open it in a new page by clicking {0}here{/0}.'
}
}
}
Sondeo largo
Indicador de función: enableLongPolling: true
(valor por defecto: false
)
El SDK utiliza WebSockets para conectarse al servidor y conversar con las aptitudes. Si, por algún motivo, el WebSocket está desactivado en la red, se pueden utilizar llamadas HTTP tradicionales para chatear con la aptitud. Esta característica se conoce como sondeo largo porque el SDK debe llamar, o sondear, continuamente para recuperar los mensajes más recientes de la aptitud. Esta función de devolución de llamada se puede activar transfiriendo enableLongPolling: true
en la configuración inicial.
Indicador de escritura para conversaciones entre usuario y agente
Indicador de función: enableSendTypingStatus
: booleano (valor por defecto: false
)
Esta función permite a los agentes determinar si los usuarios siguen participando en la conversación enviando el estado del usuario al agente en directo. Cuando enableSendTypingStatus
se define en true
, el SDK envía un evento de estado de escritura RESPONDING
junto con el texto que el usuario está escribiendo actualmente a Oracle B2C Service u Oracle Fusion Service. Esto, a su vez, muestra un indicador de escritura en la consola del agente. Cuando el usuario ha terminado de escribir, el SDK envía un evento LISTENING
al servicio para ocultar el indicador de escritura en la consola del agente.
La configuración typingStatusInterval
, que tiene un valor mínimo de tres segundos, limita la actualización del estado de escritura.
enableAgentSneakPreview
(que por defecto es false
) se debe definir en true
y la previsualización de anticipo se debe activar en la configuración de chat de Oracle B2C Service.
No tiene que configurar el estado de escritura activa en el lado del usuario. El usuario puede ver el estado de escritura del agente por defecto. Cuando el agente está escribiendo, el SDK recibe un mensaje de estado
RESPONDING
que da como resultado la visualización de un indicador de escritura en la vista del usuario. Del mismo modo, cuando el agente está inactivo, el SDK recibe un mensaje de estado LISTENING
que oculta el indicador de escritura.
Reconocimiento de voz
Indicador de función: enableSpeech: true
(valor por defecto: false
)
Al definir enableSpeech: true
se activa el botón Micrófono para mostrarse en lugar del botón Enviar cada vez que el campo de entrada de usuario esté vacío.
Su aptitud también puede utilizar el reconocimiento de voz con el método startVoiceRecording(onSpeechRecognition, onSpeechNetworkChange)
para iniciar la grabación y el método stopVoiceRecording
para parar la grabación. (Estos métodos se describen en la Guía del usuario incluida en el SDK.)
Con el indicador enableSpeechAutoSend
, puede configurar si desea o no enviar el texto que se reconoce de la voz del usuario directamente al servidor de chat sin ninguna entrada manual del usuario. Al definir esta propiedad en true
(valor por defecto), permite que la respuesta de voz del usuario se envíe automáticamente al servidor de chat. Al definirla en false
, permite al usuario editar el mensaje antes de enviarlo al servidor de chat o suprimirlo.
Visualizador de voz
Configuración de función: enableSpeechAutoSend

El modo Voz se indica cuando aparece el icono


Descripción de la ilustración voice-visualizer.png
enableSpeechAutosend
es true
(enableSpeechAutoSend: true
), los mensajes se envían de forma automática una vez que han sido reconocidos. La definición de enableSpeechAutoSend: false
cambia el modo de entrada a texto una vez que se ha reconocido el mensaje de voz, lo que permite a los usuarios editar o completar sus mensajes con texto antes de enviarlos de forma manual. Como alternativa, los usuarios pueden completar sus mensajes con voz haciendo clic a continuación en el icono de voz antes de enviarlos de forma manual.
El visualizador de voz se crea mediante AnalyserNode. Puede implantar el visualizador de voz en el modo sin cabecera mediante el método
startVoiceRecording
. Consulte SDK para obtener más información sobre AnalyserNode y los niveles de frecuencia.