Artículo original: Cómo usar Python para construir rápidamente tu propio chatbot ChatGPT
Desde que OpenAI lanzó ChatGPT, Internet no ha dejado de especular sobre el futuro de la tecnología o la humanidad.
ChatGPT se ha convertido en un producto revolucionario que tiene el potencial de impactar en casi todas las áreas del trabajo humano.
Para los desarrolladores, la integración de estas API representa una nueva frontera de innovación.
En este artículo, usaremos Gradio y el modelo OpenAI ChatGPT para construir rápidamente nuestro propio chatbot.
Introducción básica a Gradio
Gradio es una herramienta de código abierto escrita en Python.
Gradio proporciona una manera conveniente para que los desarrolladores de aprendizaje automático compartan sus modelos.
Proporciona una interfaz web simple y fácil de usar para compartir modelos de aprendizaje automático con todos, en cualquier momento y en cualquier lugar.
El punto de venta único de Gradio es que no requiere que los desarrolladores escriban Javascript, HTML o CSS para construir una interfaz web.
Para crear aplicaciones web, debe estar familiarizado con los componentes básicos de Gradio.
"Gradio te permite diseñar aplicaciones web de dos formas: Interfaz y Bloque".
Interfaz
Es una clase de alto nivel que le permite crear componentes con unas pocas líneas de código.
Puede construir componentes de entrada/salida para texto, imágenes, audio y video.
Esto tiene menor flexibilidad de diseño.
"Un ejemplo simple de la interfaz Gradio".
import gradio as gr
def sketch_recognition(img):
pass# Implement your sketch recognition model here...
gr.Interface(fn=sketch_recognition, inputs="sketchpad", outputs="label").launch()
Esto creará una interfaz web simple con una mesa de trabajo como componente de entrada y una etiqueta como componente de salida. La función sketch_recognition es responsable del resultado.
Bloquear
Gradio Block proporciona una forma de nivel inferior para construir interfaces.
"Con una mayor flexibilidad, esto permite a los desarrolladores profundizar en la creación de interfaces web complejas".
Block tiene funciones avanzadas que "le brindan la flexibilidad de colocar componentes en cualquier lugar de la pantalla, control de flujo de datos mejorado y controladores de eventos para experiencias de usuario interactivas".
import gradio as gr
def greet(name):
return"Hello " + name + "!"
with gr.Blocks() as demo:
name = gr.Textbox(label="Name")
output = gr.Textbox(label="Output Box")
greet_btn = gr.Button("Greet")
greet_btn.click(fn=greet, inputs=name, outputs=output, api_name="greet")
demo.launch()
Obtenga la clave API de OpenAI
Antes de construir la interfaz de chat, necesitamos acceso a la API de OpenAI.
Entonces, lo primero que debemos hacer es crear una cuenta OpenAi y generar nuestra clave API.
Puede hacer clic en https://platform.openai.com/account/api-keys para obtener la clave de API.
Veamos la estructura de solicitud y respuesta de la API de OpenAI.
A continuación se muestra un ejemplo de una solicitud típica a la API de ChatGPT para obtener una respuesta.
import openai
openai.ChatCompletion.create(
model="gpt-3.5-turbo",
messages=[
{"role": "system", "content": "You are a helpful assistant."},
{"role": "user", "content": "Who won the world series in 2020?"},
{"role": "assistant", "content": "The Los Angeles Dodgers won the World Series in 2020."},
{"role": "user", "content": "Where was it played?"}
]
)
El mensaje es una lista de diccionarios con sus respectivos roles y sus contenidos .
-
Los roles del sistema preconfigurados brindan cierto contexto para que un modelo se comporte de una manera específica.
-
Función de usuario Almacén Aviso de usuario
-
El rol de asistente guarda las respuestas del modelo.
Y esta lista de mensajes se encarga de mantener el contexto de la conversación.
Si tiene acceso a la API, el parámetro del modelo se puede establecer en "gpt-3.5-turbo" o "gpt-4".
Ahora veamos nuestro formato de respuesta.
{
'id': 'chatcmpl-6p9XYPYSTTRi0xEviKjjilqrWU2Ve',
'object': 'chat.completion',
'created': 1677649420,
'model': 'gpt-3.5-turbo',
'usage': {'prompt_tokens': 56, 'completion_tokens': 31, 'total_tokens': 87},
'choices': [
{
'message': {
'role': 'assistant',
'content': 'The 2020 World Series was played in Arlington, Texas at the Globe Life Field.'},
'finish_reason': 'stop',
'index': 0
}
]
}
La respuesta está en formato JSON.
Cree un chatbot ChatGPT
Interfaz de la aplicación
Usaremos la clase Blocks de Gradio. Gradio tiene un componente de chatbot preconstruido que representa una interfaz de chat.
with gr.Blocks() as demo:
chatbot = gr.Chatbot(value=[], elem_id="chatbot").style(height=650)
Ahora, necesitamos un campo de texto para pasar la pista.
Gradio tiene clases de Fila y Columna que le permiten agregar componentes vertical y horizontalmente.
Agregaremos un componente de cuadro de texto que toma la entrada de texto del usuario final.
with gr.Row():
with gr.Column(scale=0.85):
txt = gr.Textbox(
show_label=False,
placeholder="Enter text and press enter",
).style(container=False)
Guardar y recargar la página. Verás un cuadro de texto debajo de la interfaz de chat.
-
Usando el contenedor gr.Row(), creamos un bloque de diseño. Esto crea una fila para que los otros componentes se coloquen horizontalmente en una fila.
-
En la línea 2, creamos otro bloque de diseño dentro del contenedor anterior usando gr.Column(). A diferencia de Row, apila otros componentes o bloques verticalmente.
-
Dentro del contenedor de columnas, definimos un componente de cuadro de texto. Esto aceptará cualquier entrada de texto del usuario. Podemos configurar algunos parámetros para que sea más fácil de usar.
-
El parámetro de escala dentro del contenedor de columnas escala los componentes dentro. Un valor de 0,85 significa que ocupará el 85% de la pantalla en una sola línea.
Si desea agregar otros componentes, puede agregarlos usando una combinación de contenedores de Fila y Columna.
Digamos que agregamos un botón de radio para cambiar entre modelos. Esto puede hacerse de la siguiente manera.
with gr.Blocks() as demo:
radio = gr.Radio(value='gpt-3.5-turbo', choices=['gpt-3.5-turbo','gpt-4'], label='models')
chatbot = gr.Chatbot(value=[], elem_id="chatbot").style(height=650)
with gr.Row():
with gr.Column(scale=0.70):
txt = gr.Textbox(
show_label=False,
placeholder="Enter text and press enter, or upload an image",
).style(container=False)
Hasta ahora, hemos creado el front-end de la aplicación.
back-end de la aplicación
Con esto, hemos construido con éxito el front-end de la aplicación web.
Ahora, todo lo que queda es hacer que funcione.
Lo primero que tenemos que hacer es procesar la entrada.
Aquí se define una función add_text(), esta función se encargará de formatear el mensaje de forma adecuada.
def add_text(history, text):
global messages #message[list] is defined globally
history = history + [(text,'')]
messages = messages + [{"role":'user', 'content': text}]
return history, ""
Aquí, el parámetro de historial es una lista de tuplas y el texto es la entrada del usuario.
A continuación, defina una función que devuelva la respuesta.
def generate_response(history, model):
global messages
response = openai.ChatCompletion.create(
model = model,
messages=messages,
temperature=0.2,
)
response_msg = response.choices[0].message.content
messages = messages + [{"role":'assistant', 'content': response_msg}]
for char in response_msg:
history[-1][1] += char
#time.sleep(0.05)
yield history
Como puede ver arriba, enviamos el nombre del modelo, el mensaje y el valor de temperatura a la API de OpenAI.
Recibimos una respuesta. El ciclo final es responsable de representar el texto en el orden en que se recibe para mejorar la experiencia del usuario.
Como puede ver arriba, enviamos el nombre del modelo, el mensaje y el valor de temperatura al punto final de la API de OpenAI. Recibimos una respuesta.
Este bucle es responsable de representar el texto en el orden en que se recibe para mejorar la experiencia del usuario.
A continuación, agreguemos que cuando el usuario ingresa el envío, se activa la llamada al método.
with gr.Blocks() as demo:
radio = gr.Radio(value='gpt-3.5-turbo', choices=['gpt-3.5-turbo','gpt-4'], label='models')
chatbot = gr.Chatbot(value=[],elem_id="chatbot").style(height=550)
with gr.Row():
with gr.Column(scale=0.90):
txt = gr.Textbox(
show_label=False,
placeholder="Enter text and press enter",
).style(container=False)
txt.submit(add_text, [chatbot, txt], [chatbot, txt], queue=False).then(
generate_response, inputs =[chatbot,radio],outputs = chatbot,)
demo.queue()
Cuando un usuario envía un texto, toma un objeto de chatbot y un aviso como entrada. Luego, su salida se envía al componente chatbot. Después de eso, se activará la función generate_response. Esto generará las respuestas secuencialmente en el chatbot.
Ahora, la aplicación web de chat está lista.
Echemos un vistazo al efecto final. ( No hay forma de copiar la animación para ver la URL original )
Eso es todo por el intercambio de hoy. Si te parece bien, dale me gusta, reenvíalo y organízalo.