• Inicio
  • Novedades
  • Academia SAP
  • FAQ
  • Blog
  • Contacto
S4PCADEMY_Logo
  • Inicio
  • Novedades
  • Academia SAP
  • FAQ
  • Blog
  • Contacto
Twitter Linkedin Instagram

S4PCADEMY_Logo
  • Inicio
  • Novedades
  • Academia SAP
  • FAQ
  • Blog
  • Contacto
Twitter Linkedin Instagram
#ChatGPT  ·  ChatGPT  ·  Technical Articles

Integración de ChatGPT-3 en SAP Analytics Cloud usando un widget personalizado

By s4pcademy 


Autor: Danés Meraj

Perfil de Linkedin: https://www.linkedin.com/in/danish-meraj-5b3138200

“Integración de ChatGPT-3 en SAP Analytics Cloud usando el widget personalizado”. ¿Suena complejo? ¡Créeme! No lo es. Puedes hacerlo en menos de 30 minutos, incluso si eres un principiante absoluto.

Esta publicación de blog explicará cómo crear una aplicación analítica en SAP Analytics Cloud que pueda tomar consultas de los usuarios y devolver respuestas. Implicará la creación de un widget personalizado en SAP Analytics Cloud para integrarse con ChatGPT-3 utilizando la API de OpenAI.

Paso 1 Requisitos previos:

Antes de proceder con la creación de un widget personalizado y su integración en SAC, es importante que cumpla con los siguientes requisitos.

  • Crea una cuenta en la plataforma OpenAI: Cree una cuenta en la plataforma OpenAI visitando esta URL aquí.
  • Obtener la clave API: Cree una clave secreta en la sección «Cree su aplicación» de la página visitando esta URL aquí.

Figura 1: La figura muestra la creación de la clave secreta.

Nota: Asegúrese de copiar y guardar de forma segura la clave secreta. Esta clave será necesaria para realizar una llamada a la API en el paso futuro.

Paso 2: crear un widget personalizado:

El widget personalizado creado en este blog nos ayudará a integrar la nube de SAP Analytics con la API de OpenAI. El widget personalizado se crea con diferentes componentes web y un archivo JSON. Estos archivos de componentes web difieren según el caso de uso del widget personalizado. En este caso, necesitamos dos archivos, es decir, «customWidget.json» y «main.js».

No cubriré los conceptos básicos del widget personalizado, pero si desea comprender los widgets personalizados en detalle, le recomiendo leer este agradable blog. Desmitificando widgets personalizados para SAP Analytics Cloud por Pranav Kandpal.

Seleccione un método entre el Método 1 y el Método 2. Tenga en cuenta que Se recomienda el método 1 para la creación rápida del widget personalizado.

Método 1: enchufar y usar

Copie el siguiente código y guárdelo como un archivo .json en su sistema local con el nombre «customWidget» y continúe con Paso 3.

{
  "eula": "",
  "vendor": "Danish",
  "license": "",
  "id": "com.danish.sap.sac.chatgpt",
  "version": "1.0.0",
  "name": "chatGPT SAC",
  "newInstancePrefix": "chatGPTInSAC",
  "description": "A custom widget to integrate chatGPT3 in SAC Analytic application",
  "webcomponents": [
    {
      "kind": "main",
      "tag": "custom-widget",
      "url": "https://dmeraj.github.io/integrating-chatGPT3-in-SAC/main.js",
      "integrity": "",
      "ignoreIntegrity": true
    }
  ],
  "properties": {
		"width": {
			"type": "integer",
			"default": 1
		},
		"height": {
			"type": "integer",
			"default": 1
		}
  },
  "methods": {
		"post": {
			"description": "Wrapper for jQuery post",
			"parameters": [
				{
					"name": "APIKey",
					"type": "string",
					"description": ""
				},
				{
					"name": "endPoint",
					"type": "string",
					"description": ""
				},
				{
					"name": "prompt",
					"type": "string",
					"description": ""
				}
			],
			"returnType": "string"
		}
  },
  "events": {
  }
}

Método 2:

  • Copie el código a continuación y guárdelo como archivo .js en su github. Asegúrese de que el código esté alojado y se pueda acceder a él desde la URL.
    var ajaxCall = (key, url, prompt) => {
      return new Promise((resolve, reject) => {
        $.ajax({
          url: url,
          type: "POST",
          dataType: "json",
          data: JSON.stringify({
            model: "text-davinci-002",
            prompt: prompt,
            max_tokens: 1024,
            n: 1,
            temperature: 0.5,
          }),
          headers: {
            "Content-Type": "application/json",
            Authorization: `Bearer ${key}`,
          },
          crossDomain: true,
          success: function (response, status, xhr) {
            resolve({ response, status, xhr });
          },
          error: function (xhr, status, error) {
            const err = new Error('xhr error');
            err.status = xhr.status;
            reject(err);
          },
        });
      });
    };
    
    const url = "https://api.openai.com/v1";
    
    (function () {
      const template = document.createElement("template");
      template.innerHTML = `
          <style>
          </style>
          <div id="root" style="width: 100%; height: 100%;">
          </div>
        `;
      class MainWebComponent extends HTMLElement {
        async post(apiKey, endpoint, prompt) {
          const { response } = await ajaxCall(
            apiKey,
            `${url}/${endpoint}`,
            prompt
          );
          //console.log(response.choices[0].text);
          return response.choices[0].text;
        }
      }
      customElements.define("custom-widget", MainWebComponent);
    })();
  • Copie el código del método 1 y cambie el objeto «url» en la propiedad «webcomponents» a su propia URL alojada, como se muestra en la fig. 2. Guarde el archivo como «customWidget.json» y continúe con el paso 3.

Figura 2: La figura muestra la edición requerida si se cambia la URL de alojamiento.

Paso 3: Agregar el cuWidget de stom en SAC.

Agregue un widget personalizado en SAC navegando a Aplicación analítica -> Widgets personalizados y haga clic en el ícono ‘+’ como se muestra en la figura 3. Seleccione el archivo del sistema local y haga clic en «Aceptar» como se muestra en la fig. 4.

Figura 3: La figura muestra la adición del widget personalizado en SAC.

Figura 4: La figura muestra la carga del archivo json en SAC.

Etapa 4: Adición del widget personalizado a Analytic Designer.

Agregue el widget personalizado al diseñador de aplicaciones siguiendo los pasos de la figura 5.

Figura 5: La figura muestra cómo agregar un widget personalizado en el diseñador analítico.

Paso 5: Creación de una interfaz de usuario en Analytic Designer.

Agregue widgets adicionales al diseñador analítico para crear una interfaz de usuario básica y nombre los widgets como los que se muestran en la figura 6.

Figura 6: La figura muestra el widget necesario para crear una interfaz de usuario básica.

La interfaz de usuario final debería verse como se muestra en la fig. 7.

Figura 7: La figura muestra la descripción general de la interfaz de usuario.

Nota: El logotipo de ChatGPT-3 es opcional.

Paso 6: agregar un script al evento onClick

Agregue el siguiente script al evento onClick «button_submit». Reemplace SECRET_API_KEY con su clave API secreta creada en el Paso 1.

var endpoint = "completions";

var APIKey = "SECRET_API_KEY";

var prompt = InputField_prompt.getValue();

var response = chatGPTInSAC_1.post(APIKey,endpoint,prompt);

Text_response.applyText(response);

//console.log(["output", response]);

Figura 8: La figura muestra el script para el evento «onClick» en el botón.

Paso 7: Probar la integración

¡¡¡Felicidades!!! Se completó la integración de ChatGPT-3 en SAP Analytics Cloud. Adelante, escriba su consulta y obtenga la respuesta de chatGPT-3 como se muestra en la figura 9.

Nota: Si tiene problemas, como que la salida no es visible, haga que el tamaño del widget «Text_response» sea un poco más grande. Además, trate de obtener respuestas más cortas primero y luego ajuste gradualmente el resto de la interfaz de usuario para que se ajuste al requisito.

Figura 9: La figura muestra la aplicación Analítica dando respuesta de ChatGPT-3.

Conclusión: En este blog, creamos una aplicación analítica y la integramos con la API de OpenAI usando widgets personalizados. La aplicación analítica tiene una interfaz de usuario a través de la cual los usuarios pueden interactuar con el ChatGPT-3. La aplicación existente se puede ampliar y ajustar para adaptarse a casos de uso específicos. Este blog también puede dar una idea sobre cómo crear widgets personalizados para integrar con API externas.

Si encuentra útil este blog, haga clic en Me gusta en esta publicación de blog y sígame para obtener contenido relacionado con SAP Analytics Cloud. Si tiene alguna pregunta o comentario, por favor deje un comentario a continuación.

Referencias y estudios adicionales sobre un tema similar:

Integre rápidamente Sap Analytics Cloud con otros sistemas mediante un widget personalizado.

Desmitificando widgets personalizados para SAP Analytics Cloud



Source link


AnalyticsChatGPT3CloudintegraciónpersonalizadoSAPusandoWidget

Artículos relacionados


Human Resources
Cómo transportar tablas de datos/configuración de nómina de SAP que no están marcadas como Customizing
Product Information
SAP S/4HANA Cloud 2302 亮点前瞻
Business Trends  ·  intelligent enterprise  ·  Partner IP  ·  sap partners  ·  sap qualified partner
Desbloquee los beneficios de SAP S/4HANA Cloud con velocidad, flexibilidad y asequibilidad

Deja tu comentario Cancelar la respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

*

*

Cómo habilitar SAP Desktop Office Integration para SAP GUI para HTML y SAP GUI para JAVA
Previo
Uso de Postman para analizar el token XSUAA JWT que proviene de IAS
Siguiente

Madrid

Calle Eloy Gonzalo, 27
Madrid, Madrid.
Código Postal 28010

México

Paseo de la Reforma 26
Colonia Juárez,  Cuauhtémoc
Ciudad de México 06600

Costa Rica

Real Cariari
Autopista General Cañas, 
San José, SJ 40104

Perú

Av. Jorge Basadre 349
San Isidro
Lima, LIM 15073

Twitter Linkedin Instagram
Copyright 2022 | All Right Reserved.
Cookies Para que este sitio funcione adecuadamente, a veces instalamos en los dispositivos de los usuarios pequeños ficheros de datos, conocidos como cookies. La mayoría de los grandes sitios web también lo hacen.
Aceptar
Cambiar ajustes
Configuración de Cookie Box
Configuración de Cookie Box

Ajustes de privacidad

Decida qué cookies quiere permitir. Puede cambiar estos ajustes en cualquier momento. Sin embargo, esto puede hacer que algunas funciones dejen de estar disponibles. Para obtener información sobre eliminar las cookies, por favor consulte la función de ayuda de su navegador. Aprenda más sobre las cookies que usamos.

Con el deslizador, puede habilitar o deshabilitar los diferentes tipos de cookies:

  • Bloquear todas
  • Essentials
  • Funcionalidad
  • Análisis
  • Publicidad

Este sitio web hará:

Este sitio web no:

  • Esencial: recuerde su configuración de permiso de cookie
  • Esencial: Permitir cookies de sesión
  • Esencial: Reúna la información que ingresa en un formulario de contacto, boletín informativo y otros formularios en todas las páginas
  • Esencial: haga un seguimiento de lo que ingresa en un carrito de compras
  • Esencial: autentica que has iniciado sesión en tu cuenta de usuario
  • Esencial: recuerda la versión de idioma que seleccionaste
  • Functionality: Remember social media settings
  • Functionality: Remember selected region and country
  • Analytics: Keep track of your visited pages and interaction taken
  • Analytics: Keep track about your location and region based on your IP number
  • Analytics: Keep track of the time spent on each page
  • Analytics: Increase the data quality of the statistics functions
  • Advertising: Tailor information and advertising to your interests based on e.g. the content you have visited before. (Currently we do not use targeting or targeting cookies.
  • Advertising: Gather personally identifiable information such as name and location
  • Recuerde sus detalles de inicio de sesión
  • Esencial: recuerde su configuración de permiso de cookie
  • Esencial: Permitir cookies de sesión
  • Esencial: Reúna la información que ingresa en un formulario de contacto, boletín informativo y otros formularios en todas las páginas
  • Esencial: haga un seguimiento de lo que ingresa en un carrito de compras
  • Esencial: autentica que has iniciado sesión en tu cuenta de usuario
  • Esencial: recuerda la versión de idioma que seleccionaste
  • Functionality: Remember social media settings
  • Functionality: Remember selected region and country
  • Analytics: Keep track of your visited pages and interaction taken
  • Analytics: Keep track about your location and region based on your IP number
  • Analytics: Keep track of the time spent on each page
  • Analytics: Increase the data quality of the statistics functions
  • Advertising: Tailor information and advertising to your interests based on e.g. the content you have visited before. (Currently we do not use targeting or targeting cookies.
  • Advertising: Gather personally identifiable information such as name and location
Guardar y cerrar