103: Integración de aplicaciones mediante API

Introducción

La automatización de las interacciones con los clientes puede eliminar los pasos manuales, la introducción de datos en varias aplicaciones diferentes y los posibles errores y retrasos, todo lo cual supone costes adicionales para su empresa. Esta demostración automatiza una serie de pasos para: obtener y validar la información de entrada de un cliente con un problema, abrir un caso en Salesforce, adjuntar la información entrante al caso y responder al cliente con el número de caso y la fecha prevista de resolución.

Para automatizar esta interacción con el cliente, utilizaremos tanto API como integraciones con aplicaciones back-end. El escenario de demostración está relacionado con la reparación de un coche, pero es sólo un ejemplo. Las mismas técnicas son aplicables a su entorno en apoyo de sus clientes.

Empecemos.

1 - Acceder al entorno

1.1 Iniciar sesión en Cloud Pak para la integración

Narración Veamos IBM Cloud Pak for Integration en acción. Aquí tengo una versión en la nube del producto en IBM Cloud. Permítanme iniciar sesión aquí.

Acción 1.1.1 Abra Cloud Pak for Integration e introduzca su nombre de usuario (1), contraseña (2) y haga clic en Iniciar sesión (3).

1.2 Ver la pantalla de inicio de Cloud Pak for Integration

Narración ¡Bienvenidos a IBM Cloud Pak for Integration! Ahora estamos en la pantalla de inicio que muestra todas las capacidades del pak, reunidas en un solo lugar. Las capacidades de integración especializadas para la gestión de API, integración de aplicaciones, mensajería y mucho más, se construyen sobre potentes servicios de automatización. Veamos las capacidades de integración disponibles.

Acción 1.2.1 Mostrar la pantalla de inicio .

1.3 Acceso a las instancias de integración

Narración Para automatizar las interacciones de los clientes con nuestra empresa en esta demostración, utilizaremos App Connect para la integración de aplicaciones, API Connect para la gestión de API y el repositorio de activos como nuestro hub centralizado para permitir que nuestros equipos trabajen juntos con activos de integración. Abramos nuestro App Connect Designer.

Acción 1.3.1 Haga clic en ace-designer-demo para abrir el panel de integración.

2 - Importar el flujo

2.1 Crear un flujo

Narración Estamos en la herramienta de diseño. Aquí es donde podemos crear todos nuestros flujos de integración API y gestionar nuestra conectividad a los servicios y puntos finales. Como estamos empezando, todavía no hay nada que ver. Construyamos algo de lógica de integración y veamos lo simple que es crear nuestro flujo desde el Repositorio de Activos.

Acción 2.1.1 Haga clic en Crear a partir de un activo.

2.2 Seleccionar un bien

Narración Hagamos clic en el signo + para importar este flujo.

Acción 2.2.1 Haga clic en el signo + situado a la derecha de la fila Car Insurance API Lab Short V3.Busque "Seguro de coche" si el flujo no aparece en la primera página.

3 - Revisión del flujo

3.1 Revisar las propiedades

Narración El diseñador construye tu API por ti. No necesitas preocuparte por las especificaciones OpenAPI o los editores Swagger - todo está integrado. Estos son los campos que vamos a utilizar para nuestra API. Tenga en cuenta que le decimos a nuestra API qué campo es la clave - en nuestro caso, CaseReference.

Acción 3.1.1 Abra la vista Propiedades.

Acción 3.1.2 Mostrar la vista Propiedades.

Acción 3.1.3 Abra la vista Operaciones.

3.2 Revisión de las operaciones

Narración La vista Operaciones muestra las acciones que la API expone junto con los datos. En esta demostración, vamos a construir sólo una operación: "Crear CarRepairClaim". Podemos añadir más posteriormente si lo deseamos. Comprobemos la lógica de flujo.

Acción 3.2.1 Mostrar la vista Operaciones. Haga clic en Editar flujo.

3.3 Revisar el flujo

Narración Aquí tenemos nuestro flujo de demostración. En el editor de flujo de diseño, podemos editar y cambiar nuestro flujo. Somos una empresa de reparación de coches que quiere crear una API que permita a los clientes enviarnos fotos de sus coches, junto con descripciones de lo que hay que hacer con ellos. Con esta información crearemos un caso en Salesforce. Exploremos nuestro flujo en detalle.

Acción 3.3.1 Cierre el cuadro de solicitud pulsando la X.

Acción 3.3.2 Explique el flujo y desplácese por todos los conectores del flujo. Abra de nuevo la Solicitud haciendo clic en el primer paso del flujo.

3.4 Solicitud de revisión

Narración Nuestro flujo comienza recibiendo la solicitud de reparación del coche del cliente con foto a través de una API. Designer crea automáticamente una "solicitud" y una "respuesta" API para su flujo API.

Acción 3.4.1 Mostrar la casilla Solicitud (1). Haga clic para abrir el paso Si ( 2).

3.5 Validar la foto

Narración A continuación, validamos la foto. Aquí, tenemos una simple sentencia IF que comprueba si la FotoOfCar está vacía. Si no está vacía, seguimos adelante para recuperar los contactos mediante la conexión a Salesforce.

Acción 3.5.1 Explore el paso If (1). Haga clic en el conector Salesforce - Recuperar contactos (2).

3.6 Recuperar contactos

Narración Ahora, utilizamos un conector para crear un caso en Salesforce con los datos de la API. Este caso es donde almacenamos los detalles y el progreso de nuestra reparación. Utilizamos un nombre de contacto codificado: "Andy Young". Es el contacto de la compañía de seguros. Las cuentas de desarrollador de Salesforce tienen un conjunto de datos rellenados previamente que puede utilizar para realizar pruebas. Andy Young' es uno de esos contactos rellenados previamente. Vamos a probar nuestra conexión con Salesforce. Permítame cambiar el contacto a 'Andrew Young' y probar la conexión.

Acción 3.6.1 Mostrar el cuadro Salesforce - Recuperar contactos.

Acción 3.6.2 Cambie el nombre completo a Andrew Young (1). Haga clic en el icono resaltado para Intentar esta acción, que prueba la conexión (2).

Acción 3.6.3 En el cuadro de diálogo Intentar esta acción, marque No volver a mostrar este cuadro de diálogo (1) y haga clic en Continuar (2).

Aparecerá el resultado.

Narración La prueba muestra que no tenemos un 'Andrew Young'. Volvamos a cambiarlo por "Andy Young" y probemos de nuevo. Ahora recibimos una respuesta correcta. Esto demuestra que nuestra conexión funciona. Comprobemos los detalles. Aquí podemos ver la salida devuelta por Salesforce, incluido el ID de contacto.

Acción 3.6.4 Vuelva a cambiar el nombre completo a Andy Young (1). Haga clic en el icono resaltado para Volver a probar (2). Haga clic en el enlace Ver detalles (3).

Acción 3.6.5 En la pestaña Salida, abra el objeto Contacto 1.

Acción 3.6.6 Cierre todas las pestañas de diálogo. Haga clic en el conector Salesforce - Crear caso.

3.7 Crear un caso

Narración Ahora que tenemos el ID que necesitamos, vamos a crear nuestro caso de Salesforce. Observe que simplemente reutilizamos el mismo conector de Salesforce pero con una operación y datos diferentes. Aquí podemos ver que nuestro ID de contacto proviene de la anterior llamada a Salesforce 'recuperar contacto'. El nombre y la dirección de correo electrónico proceden de la solicitud API. El conector sabe que campos como 'Tipo de caso' tienen un número limitado de valores en Salesforce, por lo que los convierte automáticamente en listas desplegables de valores que puede elegir.

Acción 3.7.1 Explore el cuadro Salesforce - Crear caso (1). Abra el conector Salesforce - Crear anexo (2).

3.8 Crear un archivo adjunto

Narración Para añadir una fotografía, necesitamos crear un archivo adjunto de Salesforce. Eso será fácil, ya que simplemente utilizamos el conector de nuevo. Observe que utilizamos el ID de caso que es un valor devuelto por la llamada al conector 'Crear caso', que se mantiene en el flujo automáticamente. Enviamos el PhotoOfCar como una cadena base64 y le decimos a Salesforce que el tipo de contenido es image/jpeg.

Acción 3.8.1 Explore el cuadro Salesforce - Crear anexo (1). Abra el conector Crear comentario de caso (2).

3.9 Crear un comentario de caso

Narración Ahora añadiremos un comentario al caso con el conector de Salesforce indicando que este caso fue abierto por IBM Cloud Pak for Integration.

Acción 3.9.1 Explore el cuadro de comentarios Salesforce - Crear caso (1). Abra el conector Respuesta (2).

3.10 Responder al cliente

Narración Aquí tenemos la respuesta que enviamos al cliente tras la llamada a la API. Esta respuesta incluye la referencia de su caso en Salesforce para futuras consultas, una estimación de cuánto tardará la reparación y cuánto costará.

Acción 3.10.1 Explore el cuadro de respuesta (1). Haga clic en Hecho (2).

4 - Probar el flujo

4.1 Iniciar el flujo

Narración Ahora que hemos visto el flujo de integración, vamos a ponerlo en marcha. Cuando nuestro flujo esté en marcha, podremos probarlo.

Acción 4.1.1 Inicie el flujo cambiando el conmutador resaltado en la parte superior derecha de Detenido a Iniciado.

4.2 Probar el flujo

Las API de narración pueden probarse de varias formas, y nosotros realizaremos dos pruebas diferentes: una en la herramienta de diseño ahora; otra utilizando el Portal del Desarrollador de API que utilizaría un desarrollador de aplicaciones.En la pestaña Prueba, podemos obtener todos los detalles para probar nuestra API, por ejemplo, el endpoint y las credenciales. Y aquí podemos probar fácilmente nuestro flujo. Sólo tenemos que generar un cuerpo y enviarlo. Hemos recibido la respuesta esperada con la información del caso.

Acción 4.2.1 Abra la pestaña Probar (1). Abra POST /CarRepairClaim (2) y haga clic en Probar (3).

Acción 4.2.2 Pulse Generar (1) y Enviar (2).

Acción 4.2.3 Mostrar los detalles de la respuesta.

4.3 Comprobar Salesforce

Narración Comprobemos nuestro sistema Salesforce para ver si tenemos un nuevo caso. Abramos la página Casos. En la sección "Vistos recientemente", podemos comprobar todos los casos abiertos. Aquí tenemos nuestro caso con toda la información, incluida la imagen. Con esta información, nuestro equipo de relación con el cliente puede ayudar a nuestro cliente.

Acción 4.3.1 Abra el sitio Salesforce Dev Account (1). En el menú App Launcher, busque Casos (2). Abra la página Casos (3).

Acción 4.3.2 En la vista Casos, abra el último caso de Avería de Coche.

Acción 4.3.3 Explore todos los campos (la imagen estará en blanco).

5 - Visualización y pruebas en API Connect

5.1 Exponer la API mediante la función de coautoría

Narración Ahora vamos a explorar la función de coautoría. La función de coautoría le permite exponer simultáneamente su API tanto en App Connect Designer como en API Connect. Al iniciar la API en Designer, se crea y publica automáticamente un producto en el catálogo del entorno de pruebas. El producto se utiliza para controlar el despliegue de la API, por ejemplo, para hacerla visible en el portal de desarrolladores. Vamos a probarlo. Aquí, en el Gestor de API, podemos ver que nuestra API se expuso automáticamente desde el Diseñador, utilizando la función de coautoría. El título y el nombre del producto se derivan del nombre del flujo de API de origen y también incluyen una referencia a App Connect Designer. La versión del producto es 0.0.1.

Acción 5.1.1 Abra el menú, despliegue la sección Diseño y seleccione APIs.

Acción 5.1.2 Haga clic en la entrada ademo.

Acción 5.1.3 En la página API Connect, si se presenta una pantalla de inicio de sesión, seleccione Cloud Pak User Registry.

Acción 5.1.4 Haga clic en el icono Gestionar.

Acción 5.1.5 Haga clic en el catálogo Sandbox.

Acción 5.1.6 En la pestaña Productos, debería ver el producto publicado que contiene la API.

5.2 Visualización del producto en el portal del desarrollador mediante la función de coautoría

Narración La función de coautoría permite probar el producto también en el portal del desarrollador. Con la URL del portal, podemos comprobar que nuestro Producto API está disponible. Con la función de co-autoría, tienes una experiencia de autoría unificada a través de múltiples capacidades de Cloud Pak for Integration. Es importante tener en cuenta que el producto de API existirá en el portal para desarrolladores sólo mientras la API correspondiente en App Connect Designer siga ejecutándose. Cuando se detiene la API en App Connect Designer, el producto API se elimina automáticamente del portal. El propósito de esto es simplificar las pruebas unitarias mientras se desarrolla el flujo.

Acción 5.2.1 Abra la pestaña Configuración del catálogo (1). Haga clic en Portal (2). Copie la URL del portal (3). Abra una nueva pestaña del navegador y acceda a la URL del portal.

Acción 5.2.2 Mostrar el producto API de seguros de coche en la página de inicio del portal de desarrolladores.

Acción 5.2.3 Haga clic en Iniciar sesión (1) en la esquina superior derecha de la página. Utilice el nombre de usuario y la contraseña creados durante el paso de preparación de la demo Creación de un usuario para el portal de desarrolladores. Haga clic en Iniciar sesión (2) en el cuadro de credenciales.

5.3 Crear una nueva aplicación

Narración Como consumidor/desarrollador, vamos a crear una nueva aplicación en el portal. Esto nos dará una clave API, que nos permitirá llamar a nuestras API. Sólo tenemos que dar un título a la aplicación y copiar la clave y el secreto de la API.

Acción 5.3.1 Pulse Apps y Crear nueva app.

Acción 5.3.2 Introduzca Car Repair Application como App Title (1). Haga clic en Guardar (2).

Acción 5.3.3 En el cuadro de diálogo Credenciales, haga clic en Aceptar.

5.4 Suscribirse a la API

Narración No nos hemos suscrito a ninguna API, así que vamos a hacerlo ahora. En nuestra demostración sólo hay un producto API al que suscribirse (normalmente habría muchos). Ahora que hemos seleccionado nuestro producto API, podemos ver los planes disponibles. ¿Qué aplicación queremos utilizar para suscribirnos? Podemos tener muchas aplicaciones, pero en esta demo sólo hemos creado una. Así que sólo tenemos que seleccionar la aplicación que hemos creado antes y confirmar nuestra suscripción. Y listo, ¡ya estamos suscritos a nuestra API!

Acción 5.4.1 Haga clic en ¿Por qué no explorar las API disponibles?

Acción 5.4.2 Haga clic en Car_Insurance_API_Lab_Short_V3 0.0.1.

Acción 5.4.3 En la sección Plan por defecto, haga clic en Seleccionar.

Acción 5.4.4 Seleccionar la aplicación de reparación de automóviles.

Acción 5.4.5 Confirme la suscripción pulsando Siguiente.

Acción 5.4.6 Haga clic en Listo.

5.5 Probar la API

Narración Ahora estamos de vuelta en la pantalla del producto. Vamos a explorar nuestra API aquí. Desde la página de descripción general, podemos descargar el documento OpenAPI y obtener el punto final de la API. Fíjate en que el portal tiene todo lo que necesitas para llamar a tu API, incluso ha generado clientes en varios idiomas para que copies/pegues en tu aplicación de llamada. Puede probar la API en el área Pruébela. Utilizando el botón Generar, el portal genera una solicitud con datos de muestra aleatorios para usted. Ahora, vamos a probarlo. Genial, recibimos una respuesta, nuestra API está funcionando y hemos pasado por el portal para acceder a ella.

Acción 5.5.1 Haga clic en la API Car_Insurance.

Acción 5.5.2 Abrir POST /CarRepairClaim.

Acción 5.5.3 Explorar el área de petición de ejemplos.

Acción 5.5.4 Abra la pestaña Pruébelo.

Acción 5.5.5 Pulse Generar (1) y pulse Enviar (2).

Acción 5.5.6 Explorar la respuesta.

Resumen

Resumamos lo que hemos hecho hoy.

En la demostración: accedimos al entorno de Cloud Pak for Integration y exploramos sus capacidades; importamos y revisamos el flujo de integración automatizado de interacciones con el cliente; probamos el flujo; desplegamos el flujo en el entorno de ejecución de Cloud Pak; y demostramos cómo un desarrollador puede utilizar el Portal de API para realizar el consumo de autoservicio de la API.

Desde una perspectiva empresarial, utilizamos API e integraciones de aplicaciones para automatizar una serie de pasos para: obtener y validar la información de entrada de un cliente con una preocupación, abrir un caso en Salesforce, adjuntar la información de entrada al caso y responder al cliente con el número de caso y la fecha prevista de resolución.

El cliente que necesita asistencia obtiene una respuesta rápida a su interacción y la confianza de que su empresa está gestionando su solicitud.

Gracias por asistir a la presentación de hoy.