¿Qué es el error de CORS y por qué ocurre en Node.js?
El error de CORS (Cross-Origin Resource Sharing o Intercambio de Recursos de Origen Cruzado) es una medida de seguridad implementada por los navegadores web modernos. Ocurre cuando una aplicación frontend que se ejecuta en un dominio, puerto o protocolo intenta realizar peticiones HTTP a un backend alojado en un origen diferente, y el servidor no responde con las cabeceras HTTP adecuadas que autoricen dicha conexión.
En el entorno de desarrollo con Node.js y Express, este fallo se manifiesta comúnmente en la consola del navegador con mensajes como: Access to fetch at 'http://localhost:5000/api/data' from origin 'http://localhost:3000' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
Causas principales del bloqueo por CORS en APIs
- El servidor Express no incluye las cabeceras HTTP necesarias para permitir el acceso desde el origen del cliente.
- Se intenta consumir una API desde un dominio diferente sin haber configurado explícitamente políticas de confianza.
- Las solicitudes complejas (como métodos PUT, DELETE o el uso de cabeceras personalizadas) fallan porque el navegador envía primero una petición de sondeo (método OPTIONS) que el servidor rechaza o no maneja correctamente.
Método 1: Solucionar CORS usando el paquete oficial cors en Express
La forma más limpia, rápida y recomendada de solucionar este problema en una aplicación de Node.js y Express es utilizando el middleware oficial cors.
- Abre tu terminal en la raíz del proyecto backend y ejecuta el siguiente comando para instalar el paquete:
npm install cors - Abre tu archivo principal de configuración (usualmente
app.jsoserver.js). - Importa el paquete y configúralo antes de definir tus rutas. Aquí tienes un ejemplo básico que permite solicitudes desde cualquier origen:
const express = require('express');
const cors = require('cors');
const app = express();
// Habilitar CORS para todas las peticiones
app.use(cors());
app.get('/api/data', (req, res) => {
res.json({ message: '¡CORS configurado correctamente!' });
});
app.listen(5000, () => console.log('Servidor corriendo en puerto 5000'));Método 2: Configurar CORS de forma restrictiva y segura para Producción
Permitir el acceso desde cualquier origen (usando cors() sin parámetros) puede ser peligroso en entornos de producción. Es una buena práctica limitar qué dominios pueden consumir tu API.
- Modifica la implementación del middleware pasando un objeto de opciones con la propiedad
origin. - Define una lista blanca de dominios permitidos o utiliza una función condicional.
- Implementa el siguiente código en tu servidor Express:
const express = require('express');
const cors = require('cors');
const app = express();
const whitelist = ['https://tudominio.com', 'http://localhost:3000'];
const corsOptions = {
origin: function (origin, callback) {
if (whitelist.indexOf(origin) !== -1 || !origin) {
callback(null, true);
} else {
callback(new Error('Bloqueado por la política de CORS'));
}
}
};
app.use(cors(corsOptions));
app.get('/api/secure', (req, res) => {
res.json({ message: 'Acceso autorizado solo para orígenes confiables' });
});