IA en el servidor

Por qué no llamamos a la IA directamente desde el navegador

Los servicios de IA (OpenAI, Anthropic y otros) exigen una API key – un código secreto que te identifica y sirve para facturar. Y aquí está el truco:

Todo lo que pones en JavaScript en el navegador lo puede leer cualquiera (F12 → código fuente). Si tu clave estuviera ahí, cualquiera podría usar la IA con tu dinero.

Ya conoces la solución del Maestro: tu propio servidor. La clave se queda en el servidor y el navegador solo habla con tu servidor:

Browser  →  your server (the key is here!)  →  AI service
Browser  ←  your server                     ←  AI service

Te lo muestro: el endpoint /zeptat-se

Partiremos del servidor Express del Maestro. Guardaremos la clave en un archivo .env (esto nunca va a GitHub – ¡añádelo a .gitignore!):

AI_KLIC=sk-your-secret-key-here

Y el servidor recibe un endpoint nuevo:

require('dotenv').config();
const express = require('express');
const app = express();
app.use(express.json());
app.use(express.static('public'));

app.post('/zeptat-se', async (req, res) => {
  const { otazka } = req.body;

  const odpoved = await fetch('https://api.openai.com/v1/chat/completions', {
    method: 'POST',
    headers: {
      'Content-Type': 'application/json',
      'Authorization': `Bearer ${process.env.AI_KLIC}`,
    },
    body: JSON.stringify({
      model: 'gpt-4o-mini',
      messages: [
        { role: 'system', content: 'You are a friendly helper. Answer briefly in English.' },
        { role: 'user', content: otazka },
      ],
    }),
  });

  const data = await odpoved.json();
  res.json({ text: data.choices[0].message.content });
});

app.listen(3000, () => console.log('Server running at http://localhost:3000'));

Qué hay de nuevo aquí:

• fetch también puede enviar datos: method: 'POST' y body.
• Los headers con Authorization – ahí se presenta la clave.
• role: 'system' – ¡ese es tu prompt de la lección anterior! Define cómo se comporta la IA.
• process.env.AI_KLIC – la clave se lee de .env, no está escrita en el código.

Ahora tú 💪

1. Añade la línea .env a .gitignore – compruébalo con el comando git status (el archivo .env no debe aparecer).
2. Crea el endpoint /zeptat-se siguiendo el ejemplo.
3. ¿No tienes clave? No pasa nada – devuelve una respuesta de prueba por ahora y sigue a la siguiente lección:

app.post('/zeptat-se', (req, res) => {
  res.json({ text: `Test answer to: "${req.body.otazka}"` });
});

4. Prueba el endpoint desde el navegador (consola F12):

const r = await fetch('/zeptat-se', {
  method: 'POST',
  headers: { 'Content-Type': 'application/json' },
  body: JSON.stringify({ otazka: 'Hi, who are you?' }),
});
console.log(await r.json());

Lo que te llevas de esta lección

• Las claves secretas van en el servidor en .env, nunca en el navegador ni en Git.
• fetch puede hacer POST – envía datos en body y la clave en headers.
• El system prompt define la personalidad de tu ayudante con IA.

© 2026 Ing. Martin Polak / AlgoRhino · Condiciones de uso del contenido