Cómo Solucionar el Error CORS en Node.js Definitivamente

Cómo Solucionar el Error CORS en Node.js Definitivamente
Anuncio relacionado

¿Qué es el Error CORS y por qué ocurre en Node.js?

El error CORS (Cross-Origin Resource Sharing) es un mecanismo de seguridad implementado por los navegadores web que restringe las solicitudes HTTP realizadas desde un dominio (origen) hacia un servidor ubicado en un dominio diferente. Cuando desarrollas una API en Node.js con Express y tu frontend se encuentra en otro puerto o dominio, el navegador bloquea la respuesta por defecto.

Causas principales del bloqueo por CORS

  • Ausencia de cabeceras HTTP de control de acceso en las respuestas del servidor.
  • Intentar consumir una API desde un dominio, subdominio o puerto diferente sin autorización previa.
  • Configuración restrictiva en el middleware de seguridad del backend.

Método 1: Instalar y configurar el paquete cors en Express

La forma más rápida y recomendada de solucionar este problema en Node.js es utilizando el paquete oficial cors. Sigue estos pasos para implementarlo:

  1. Abre tu terminal en la raíz del proyecto backend.
  2. Ejecuta el comando de instalación: npm install cors
  3. Abre tu archivo principal (por ejemplo, app.js o server.js).
  4. Importa y añade el middleware antes de definir tus rutas:

const cors = require('cors');

const app = express();

app.use(cors());

Método 2: Configurar orígenes específicos por seguridad

Si estás en un entorno de producción, habilitar CORS para cualquier origen puede ser un riesgo de seguridad. Es recomendable limitar el acceso únicamente a tu dominio frontend autorizado:

  1. Define las opciones de configuración con una lista blanca de dominios permitidos.
  2. Aplica el middleware pasando el objeto de configuración:

const whitelist = ['https://tufrontendsitio.com'];

const corsOptions = { origin: function (origin, callback) { if (whitelist.indexOf(origin) !== -1 || !origin) { callback(null, true); } else { callback(new Error('Bloqueado por política CORS')); } } };

app.use(cors(corsOptions));

Método 3: Configurar cabeceras HTTP manualmente (Sin librerías)

Si prefieres no instalar dependencias externas, puedes configurar manualmente los headers permitidos creando un middleware personalizado:

  1. Crea un archivo de middleware para interceptar las peticiones.
  2. Añade las cabeceras correspondientes para permitir métodos y credenciales:

app.use((req, res, next) => { res.header('Access-Control-Allow-Origin', '*'); res.header('Access-Control-Allow-Headers', 'Origin, X-Requested-With, Content-Type, Accept, Authorization'); res.header('Access-Control-Allow-Methods', 'GET, POST, PUT, DELETE, OPTIONS'); next(); });

Anuncio
Seguir Leyendo

Guías y Soluciones Relacionadas

Windows Apps Juegos
WordPress

Cómo Solucionar el Error al Establecer una Conexión con la Base de Datos en WordPress de Forma Definitiva

Descubre las causas principales del fallo de conexión en WordPress y aplica nuestros métodos infalibles para solucionarlo en minutos. Vuelve a poner online tu sitio web.

Leer guía completa →
PrestaShop

Cómo Solucionar el Error Token Expired en PrestaShop de Forma Definitiva

Aprende a solucionar el error de token caducado en PrestaShop para que puedas volver a gestionar tu tienda online sin interrupciones ni bloqueos en el panel de administración.

Leer guía completa →
Mac

Cómo Solucionar el Error de Impresora Pausada en Mac Definitivamente

Aprende a resolver el molesto problema de la impresora pausada en macOS de forma rápida y sencilla. Sigue nuestros métodos probados para restablecer el sistema de impresión.

Leer guía completa →