Cómo Crear un Chatbot Gratis con Cloudflare Workers AI

Crea un Chatbot de IA Gratis con Cloudflare Workers AI

Cloudflare Workers AI te permite ejecutar modelos de IA de forma serverless sin gestionar infraestructura. ¿La mejor parte? Obtienes 10,000 Neurons gratis diarios—suficiente para cientos de conversaciones por día.

En esta guía, construiremos un chatbot simple usando la API REST que puedes llamar desde cualquier aplicación.

Lo Que Aprenderás

• Configurar credenciales de Cloudflare Workers AI
• Hacer llamadas API a modelos de IA
• Construir una interfaz de chat simple
• Elegir el modelo correcto para tu caso de uso

Requisitos Previos

• Una cuenta de Cloudflare (gratis)
• Conocimiento básico de JavaScript/llamadas API
• Una forma de hacer solicitudes HTTP (curl, Postman o código)

¿Por Qué Cloudflare Workers AI?

Paso 1: Obtener tus Credenciales API

1. Inicia sesión en el Dashboard de Cloudflare
2. Ve a AI → Workers AI en la barra lateral
3. Haz clic en Use REST API
4. Haz clic en Create a Workers AI API Token y cópialo
5. Copia tu Account ID desde la URL del dashboard o página de overview

Guarda estos valores:

CLOUDFLARE_ACCOUNT_ID=tu-account-id
CLOUDFLARE_API_TOKEN=tu-api-token

Paso 2: Hacer tu Primera Llamada API

El formato del endpoint API es:

https://api.cloudflare.com/client/v4/accounts/{ACCOUNT_ID}/ai/run/{MODELO}

Probemos con Llama 3.1 8B usando curl:

curl https://api.cloudflare.com/client/v4/accounts/TU_ACCOUNT_ID/ai/run/@cf/meta/llama-3.1-8b-instruct \
  -H "Authorization: Bearer TU_API_TOKEN" \
  -H "Content-Type: application/json" \
  -d '{
    "messages": [
      {"role": "system", "content": "Eres un asistente útil."},
      {"role": "user", "content": "¿Cuál es la capital de Francia?"}
    ]
  }'

Respuesta:

{
  "result": {
    "response": "La capital de Francia es París."
  },
  "success": true
}

Paso 3: Modelos Disponibles

Aquí hay algunos modelos populares que puedes usar:

Generación de Texto (Chat)

Tip: Comienza con llama-3.1-8b-instruct para pruebas—es rápido y usa menos Neurons.

Paso 4: Construir un Chatbot Simple

Aquí hay un ejemplo completo en JavaScript que mantiene el historial de conversación:

const ACCOUNT_ID = 'tu-account-id';
const API_TOKEN = 'tu-api-token';
const MODEL = '@cf/meta/llama-3.1-8b-instruct';

const conversationHistory = [
  { role: 'system', content: 'Eres un asistente útil. Sé conciso.' }
];

async function chat(userMessage) {
  // Agregar mensaje del usuario al historial
  conversationHistory.push({ role: 'user', content: userMessage });

  const response = await fetch(
    `https://api.cloudflare.com/client/v4/accounts/${ACCOUNT_ID}/ai/run/${MODEL}`,
    {
      method: 'POST',
      headers: {
        'Authorization': `Bearer ${API_TOKEN}`,
        'Content-Type': 'application/json'
      },
      body: JSON.stringify({ messages: conversationHistory })
    }
  );

  const data = await response.json();

  if (data.success) {
    const assistantMessage = data.result.response;
    // Agregar respuesta del asistente al historial
    conversationHistory.push({ role: 'assistant', content: assistantMessage });
    return assistantMessage;
  } else {
    throw new Error(data.errors?.[0]?.message || 'Error de API');
  }
}

// Uso
const answer = await chat('¿Qué es machine learning?');
console.log(answer);

const followUp = await chat('¿Puedes darme un ejemplo?');
console.log(followUp);

Paso 5: Crear un Endpoint API

Si quieres exponer esto como una API, aquí hay un servidor Express.js simple:

import express from 'express';

const app = express();
app.use(express.json());

const ACCOUNT_ID = process.env.CLOUDFLARE_ACCOUNT_ID;
const API_TOKEN = process.env.CLOUDFLARE_API_TOKEN;
const MODEL = '@cf/meta/llama-3.1-8b-instruct';

app.post('/api/chat', async (req, res) => {
  const { messages } = req.body;

  if (!messages || !Array.isArray(messages)) {
    return res.status(400).json({ error: 'Se requiere array de messages' });
  }

  try {
    const response = await fetch(
      `https://api.cloudflare.com/client/v4/accounts/${ACCOUNT_ID}/ai/run/${MODEL}`,
      {
        method: 'POST',
        headers: {
          'Authorization': `Bearer ${API_TOKEN}`,
          'Content-Type': 'application/json'
        },
        body: JSON.stringify({ messages })
      }
    );

    const data = await response.json();

    if (data.success) {
      res.json({ response: data.result.response });
    } else {
      res.status(500).json({ error: data.errors?.[0]?.message });
    }
  } catch (error) {
    res.status(500).json({ error: 'Fallo al obtener respuesta' });
  }
});

app.listen(3000, () => console.log('Servidor corriendo en puerto 3000'));

Llámalo desde tu frontend:

const response = await fetch('/api/chat', {
  method: 'POST',
  headers: { 'Content-Type': 'application/json' },
  body: JSON.stringify({
    messages: [
      { role: 'system', content: 'Eres un asistente útil.' },
      { role: 'user', content: '¡Hola!' }
    ]
  })
});

const data = await response.json();
console.log(data.response);

Paso 6: Respuestas en Streaming (Opcional)

Para un efecto de escritura tipo ChatGPT, habilita streaming:

const response = await fetch(
  `https://api.cloudflare.com/client/v4/accounts/${ACCOUNT_ID}/ai/run/${MODEL}`,
  {
    method: 'POST',
    headers: {
      'Authorization': `Bearer ${API_TOKEN}`,
      'Content-Type': 'application/json'
    },
    body: JSON.stringify({
      messages: [{ role: 'user', content: 'Cuéntame una historia' }],
      stream: true
    })
  }
);

const reader = response.body.getReader();
const decoder = new TextDecoder();

while (true) {
  const { done, value } = await reader.read();
  if (done) break;

  const chunk = decoder.decode(value);
  // Parsear formato SSE: data: {"response": "..."}
  const lines = chunk.split('\n');
  for (const line of lines) {
    if (line.startsWith('data: ')) {
      const json = JSON.parse(line.slice(6));
      process.stdout.write(json.response);
    }
  }
}

Parámetros de la API

Roles de Mensaje

Estimación de Costos

Cloudflare usa "Neurons" como unidad de facturación:

Ejemplo: Una conversación típica (prompt + respuesta) usa ~100-500 Neurons dependiendo de la longitud. El tier gratuito soporta 20-100 conversaciones/día.

Mejores Prácticas

1. Usa prompts de sistema: Define la personalidad y restricciones de la IA
2. Limita el historial: Mantén solo los últimos 10-20 mensajes para ahorrar Neurons
3. Maneja errores: Siempre verifica data.success antes de usar la respuesta
4. Configura max_tokens: Previene respuestas desbordadas limitando la salida
5. Cachea respuestas: Para consultas repetidas, considera cachear

// Ejemplo: Limitar historial de conversación
if (conversationHistory.length > 20) {
  // Mantener prompt de sistema + últimos 19 mensajes
  conversationHistory = [
    conversationHistory[0],
    ...conversationHistory.slice(-19)
  ];
}

Solución de Problemas

401 Unauthorized

• Verifica que tu API token es correcto
• Asegúrate de que el token tiene permisos de Workers AI

400 Bad Request

• Verifica tu estructura JSON
• Comprueba que messages es un array

Rate Limited

• Has excedido el tier gratuito
• Espera hasta el siguiente día o actualiza a pago

Respuestas Lentas

• Prueba un modelo más pequeño (8B en lugar de 70B)
• Reduce max_tokens si no necesitas respuestas largas

Conclusión

Ahora tienes un chatbot de IA funcionando con Cloudflare Workers AI con:

• Uso diario gratuito (10,000 Neurons)
• Acceso a 50+ modelos incluyendo Llama, Gemma y Mistral
• API REST simple que funciona desde cualquier lenguaje
• Soporte de streaming para respuestas en tiempo real

Esta es una alternativa económica a OpenAI u otras APIs pagas para proyectos personales y prototipos.

Recursos Relacionados

• Documentación de Cloudflare Workers AI
• Catálogo de Modelos Workers AI
• Cloudflare AI Gateway
• Guía de API REST Workers AI