Crea tu propio chatbot con la API de OpenAI y Gradio en Python
Tags: python, chatgpt, gradio, openai
Published: 2023-03-23 02:55:47

---
title: Crea tu propio chatbot con la API de OpenAI y Gradio en Python
published: true
date: 2023-03-22 19:05:18 UTC
tags: python, chatgpt, gradio, openai
canonical_url: https://blog.rafnixg.dev/crea-tu-propio-chatbot-con-la-api-de-openai-y-gradio-en-python
---

Hoy vamos a aprender a crear una aplicacin en Python utilizando la API de OpenAI y Gradio. Esta publicacin ser til para las personas que quieren aprender a utilizar la API de OpenAI y crear una aplicacin con una interfaz de usuario interactiva de forma rapida y sin necesidad de usar HTML, CSS y Javscript.

## Introduccin

Antes de empezar, debemos entender qu es la API de OpenAI y Gradio.

[OpenAI](https://openai.com/) es una organizacin de investigacin en inteligencia artificial. Ofrecen una API que permite acceder a modelos de inteligencia artificial avanzados para realizar diversas tareas, como responder preguntas, traducir oraciones, resumir noticias y ms.

Por otro lado, [Gradio](https://gradio.app/) es una herramienta de cdigo abierto para crear interfaces de usuario interactivas para modelos de inteligencia artificial. Ofrece una manera fcil y rpida de crear una interfaz de usuario para cualquier modelo de aprendizaje automtico.

Ahora que tenemos una comprensin bsica de ambas herramientas, comencemos con el tutorial.

## **Conectando a la API de OpenAI**

Para usar la API de OpenAI, necesitamos generar una clave API. Siga estos pasos para obtener su clave API:

1. Visite el sitio web de [OpenAI](https://platform.openai.com/signup) y regstrese para obtener una cuenta gratuita.

2. Inicie sesin en su cuenta y vaya a la pgina de la [API](https://platform.openai.com/account/api-keys).

3. Cree una nueva clave API y cpiela porque la usaremos mas adelante.

## Instalacin de dependencias

En este tutorial, crearemos una aplicacin de Chatbot utilizando la API de OpenAI y Gradio. Para empezar, necesitamos ubicarnos en la carpeta donde vamos a trabajar nuestro proyecto e instalar ambos paquetes en nuestra mquina. Como un paso previo a la instalacin de las dependecias se puede crear un entorno virtual de python para que las librerias no tengan colision con las del sistema:

```
python3 -m venv venv
source venv/bin/activate

```

Luego de activar el entorno virtual, procedemos a instalar las dependencias:

```
pip install openai
pip install gradio

```

## Configuracin de la clave API de OpenAI

Una vez que tengamos ambos paquetes instalados, podemos comenzar a escribir nuestro cdigo.

Primero, debemos configurar la API de OpenAI para poder acceder a sus servicios. Una vez que tengamos la clave API, podemos configurarla en nuestro cdigo de Python creando un archivo llamado `chatbot.py` utilizando el siguiente cdigo.

```
import openai
import os

# Obtener la clave API de OpenAI de la variable de entorno
openai.api_key = os.environ.get("OPENAI_API_KEY", None)

```

Asegrate de configurar la variable de entorno `OPENAI_API_KEY` con tu clave API real antes de ejecutar el cdigo, sino en la ultima seccin te explico como hacerlo.

Ahora que tenemos la clave API configurada, podemos comenzar a interactuar con la API de OpenAI. En este tutorial, crearemos un chatbot que puede responder a las preguntas de los usuarios.

## Configuracin del mensaje por defecto

Para crear un chatbot utilizando la API de OpenAI, necesitamos proporcionar una serie de mensajes como entrada a la API. Cada mensaje es una cadena de texto que representa el mensaje enviado por un usuario o el chatbot. Usaremos un mensaje por defecto para configurar y condicionar las respuesta GPT:

```
messages = [
    {
        "role": "system",
        "content": "Act like a personal assistant. You can respond to questions, translate sentences, summarize news, and give recommendations."
    }
]

```

En este ejemplo, el chatbot comienza presentndose como un asistente personal y proporcionando una lista de tareas que puede realizar.

## Funcin de llamada a la API de OpenAI

Una vez que tenemos los mensajes de entrada preparados, podemos enviarlos a la API de OpenAI para generar una respuesta utilizando el siguiente cdigo.

```

def openai_process_message(user_message):
    # Set the prompt for OpenAI Api
    messages = [
        {
            "role": "system",
            "content": "Act like a personal assistant. You can respond to questions, translate sentences, summarize news, and give recommendations."
        }
    ]
    messages.append({"role": "user", "content": user_message})
    # Call the OpenAI Api to process our prompt
    openai_response = openai.ChatCompletion.create(model="gpt-3.5-turbo", messages=messages, max_tokens=2000)
    # Parse the response to get the response text for our prompt
    response_text = openai_response.choices[0].message.content
    return response_text

```

La funcin `openai_process_message` toma como entrada el mensaje del usuario y lo agrega a la lista de mensajes como un mensaje de usuario. A continuacin, llama a la API de OpenAI para procesar los mensajes y generar una respuesta. Por ltimo, la funcin devuelve la respuesta generada por la API de OpenAI.

## Creacin de la UI con Gradio

A continuacin, crearemos una lista de ejemplos que se utilizarn para mostrar ejemplos en la interfaz de usuario. En este caso, utilizaremos preguntas sobre la inteligencia artificial.

```
examples = [
    "Que es la IA?",
    "Como funciona una red neuronal?",
    "pueden las maquinas aprender?",
]

```

Luego, creamos una instancia de la clase `Interface` de Gradio y le pasamos la funcin `openai_process_message()` como argumento. A continuacin, definimos el tipo de entrada y salida que deseamos para nuestra interfaz. En este caso, utilizaremos una caja de texto para la entrada del usuario y otra para mostrar la respuesta del chatbot.

```
# Create a Gradio interface instance
demo = gr.Interface(
    fn=openai_process_message,
    inputs=gr.Textbox(lines=5, label='Pregunta', placeholder='Escribe tu pregunta aqu...'),
    outputs=gr.Textbox(label='Respuesta'),
    examples=examples,
    title="Chatbot OpenAI API",
)

```

Finalmente, lanzamos la interfaz de usuario utilizando el mtodo `launch()`.

```
if __name__ == " __main__":
    demo.launch()

```

## Corriendo nuestra aplicacin

Recuerda que antes de lanzar la aplicacin, debes configurar la variable de entorno "OPENAI\_API\_KEY" con tu clave de API de OpenAI. Puedes hacerlo de la siguiente manera en tu terminal:

```
export OPENAI_API_KEY=<tu_clave_de_api>

```

Donde <tu\_clave\_de\_api> debe ser reemplazada con tu clave de API real de OpenAI.

Para lanzar la aplicacin, puedes simplemente ejecutar el archivo Python en tu terminal o IDE de Python:

```
python chatbot.py

```

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1679438402612/e8a57a90-5afd-4d5e-9dfa-a6ef90d6bd3e.png)

Con esto ya tenemos nuestra app corriendo sobre https://127.0.0.1:7860 y con la siguiente UI de forma facil y rapida:

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1679438572766/7cba6334-d1b2-43bb-b34c-4c60369c4151.png)

## Conclusiones

Ahora tenemos una aplicacin completa de preguntas y respuestas que utiliza la API de OpenAI para generar respuestas a cualquier pregunta que el usuario pueda tener. Esta aplicacin es solo un ejemplo de lo que se puede hacer con la API de OpenAI y la biblioteca Gradio. Hay muchas otras aplicaciones de inteligencia artificial que se pueden crear utilizando estas herramientas.

En un proximo post voy a implementar otra UI usando el componente Chatbot de Gradio para darle un diseo mas acoorde al un chatbot y algunos otros tips a la hora de usar Gradio, por el momento es un buen punto de partida para practicar y probar estas tecnologias.

## Codigo completo

```
# Archivo chatbot.py
import gradio as gr
import openai
import os

# Get OpenAI API Key from environment variable
openai.api_key = os.environ.get("OPENAI_API_KEY", None)

def openai_process_message(user_message):
    # Set the prompt for OpenAI Api
    messages = [
        {
            "role": "system",
            "content": "Act like a personal assistant. You can respond to questions, translate sentences, summarize news, and give recommendations."
        }
    ]
    messages.append({"role": "user", "content": user_message})
    # Call the OpenAI Api to process our prompt
    openai_response = openai.ChatCompletion.create(model="gpt-3.5-turbo", messages=messages, max_tokens=2000)
    # Parse the response to get the response text for our prompt
    response_text = openai_response.choices[0].message.content
    return response_text

examples = [
    "Que es un chatbot?",
    "podrias definir que es una IA?",
    "dime cual seria una receta para hacer salsa bechamel?",
]

demo=gr.Interface(
    fn=openai_process_message,
    inputs=gr.Textbox(lines=5, label='Pregunta',placeholder='Escribe tu pregunta'),
    outputs=gr.Textbox(label='Respuesta'),
    examples=examples,
    title="Chatbot OpenAI API",
)
if __name__ == " __main__":
    demo.launch()

```