Skip to main content
PHP

Cómo integrar la API de OpenAI (ChatGPT) en un proyecto PHP o JavaScript real

Por 31 octubre, 2025Sin comentarios
Integrar ChatGPT con PHP y Javascript

La inteligencia artificial ya forma parte del día a día de los desarrolladores web. Desde redactores automáticos hasta asistentes virtuales o buscadores inteligentes, GPT-4 y GPT-5 de OpenAI permiten llevar tu proyecto PHP o JavaScript a otro nivel.

En esta guía práctica verás cómo integrar la API de OpenAI paso a paso, tanto en PHP como en JavaScript, y además te dejaré ejemplos funcionales para crear tu propio asistente de soporte o generador de texto inteligente.

🧩 Paso 1. Crea tu cuenta y consigue tu API Key

  1. Entra en 👉 https://platform.openai.com

  2. Crea una cuenta (o inicia sesión).

  3. Dirígete a “View API keys” y genera una nueva.

Guarda esa clave, porque la necesitarás para todas tus peticiones:

sk-xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx

⚠️ Importante: no la publiques ni la subas a GitHub.
Trátala igual que una contraseña.

⚙️ Paso 2. Entiende cómo funciona la API

OpenAI expone un endpoint HTTP que puedes llamar desde cualquier lenguaje.
El modelo más actual (GPT-4 Turbo o GPT-5) se accede mediante peticiones POST al endpoint:

https://api.openai.com/v1/chat/completions

El cuerpo de la petición debe incluir:

  • El modelo (gpt-4-turbo, gpt-5, etc.)

  • Una lista de mensajes (role: system, user, assistant)

  • Opcionalmente parámetros como temperature o max_tokens.

💻 Paso 3. Ejemplo en PHP

Este ejemplo crea un asistente de soporte técnico que responde en lenguaje natural.

<?php
$apiKey = 'TU_API_KEY_AQUI';
$data = [
"model" => "gpt-4-turbo",
"messages" => [
["role" => "system", "content" => "Eres un asistente técnico amable y experto en soporte web."],
["role" => "user", "content" => "Mi web WordPress va lenta, ¿qué puedo hacer?"] ],
"temperature" => 0.7,
"max_tokens" => 300
];$ch = curl_init('https://api.openai.com/v1/chat/completions');
curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
curl_setopt($ch, CURLOPT_HTTPHEADER, [
'Content-Type: application/json',
'Authorization: Bearer ' . $apiKey
]);
curl_setopt($ch, CURLOPT_POST, true);
curl_setopt($ch, CURLOPT_POSTFIELDS, json_encode($data));$response = curl_exec($ch);
curl_close($ch);$result = json_decode($response, true);
echo $result['choices'][0]['message']['content'];
?>

✨ Qué hace:
Envía la pregunta del usuario a GPT-4 Turbo y muestra la respuesta.
Puedes adaptar el rol «system» para crear diferentes tipos de asistentes:

  • “Eres un generador de descripciones SEO.”

  • “Responde de forma breve y profesional.”

🧠 Paso 4. Ejemplo en JavaScript (fetch API)

Ideal para proyectos con Node.js, Next.js o incluso frontends puros.

<script>
async function generarTexto(prompt) {
const response = await fetch("https://api.openai.com/v1/chat/completions", {
method: "POST",
headers: {
"Content-Type": "application/json",
"Authorization": "Bearer TU_API_KEY_AQUI"
},
body: JSON.stringify({
model: "gpt-4-turbo",
messages: [
{ role: "system", content: "Eres un generador de textos creativos para blogs." },
{ role: "user", content: prompt }
],
temperature: 0.8,
max_tokens: 250
})
});
const data = await response.json();
console.log(data.choices[0].message.content);
}
// Ejemplo de uso:
generarTexto("Escribe una introducción para un artículo sobre seguridad web en 2025");
</script>

⚡ Puedes integrarlo en formularios para que los usuarios generen textos, obtengan respuestas o hagan búsquedas semánticas.

🔍 Paso 5. Ejemplo: Buscador semántico con GPT-4 / GPT-5

Imagina que tienes un listado de artículos en tu web y quieres que el usuario busque por intención, no solo por palabra clave.

Ejemplo básico en PHP:

$userQuery = "cómo asegurar mi servidor apache";
$context = "Artículos: seguridad WordPress, optimización WPO, guías PHP, migración servidores, firewall Linux";
$data = [
"model" => "gpt-4-turbo",
"messages" => [
["role" => "system", "content" => "Eres un motor de búsqueda semántico. Devuelve el título más relevante del contexto."],
["role" => "user", "content" => "Consulta: $userQuery. Contexto: $context"] ],
"max_tokens" => 50
];

GPT devuelve la opción más relevante según significado, no solo coincidencia literal.
Puedes usar esta lógica para rankear resultados de una base de datos.

🧱 Paso 6. Buenas prácticas y seguridad

✅ Guarda la clave en variables de entorno, nunca en el código fuente:

export OPENAI_API_KEY="sk-xxxxxxxx"

✅ Implementa límites de uso y logs.
Para evitar abusos o consumos inesperados, controla cuántas peticiones se hacen.

✅ Caché de respuestas.
Si un usuario pregunta lo mismo, guarda la respuesta localmente para no consumir créditos.

✅ Protege el endpoint si usas JavaScript en el frontend.
Nunca expongas la clave directamente en el navegador. Haz las peticiones desde tu servidor.

💡 Paso 7. Ideas para aplicar en proyectos reales

  • 💬 Asistente de soporte integrado en tu panel de clientes.

  • ✍️ Generador de textos SEO o descripciones de productos.

  • 🔍 Buscador semántico en tu blog o base de conocimiento.

  • 📄 Revisor de contenido que detecta errores o resume textos.

  • 🧩 Chat contextual con datos de tu propia base de datos (usando embeddings).

🎯 Conclusión

Integrar la API de OpenAI con PHP o JavaScript es más fácil de lo que parece.
Con unas pocas líneas de código puedes ofrecer una experiencia inteligente y conversacional en cualquier aplicación web.

Y lo mejor: puedes adaptarlo a tu propio flujo —desde un chatbot hasta un generador de contenido profesional.

Jairo Calero

Desarrollador web frontend y backend, especialista en webs app desarrolladas en PHP y Javascript. Experto en HTML, CSS3, PHP y Javascript con frameworks y librerías como jQuery, Angular y Bootstrap. Gestor de herramientas SEO como Google Analytics, Search Console, SEMrush o Hotjar. Email marketing y Big data.

Deja tu respuesta