Qué es CORS y cómo usarlo en Node.js

---

Cuando desarrollamos aplicaciones web modernas, es común que el frontend y el backend se encuentren en diferentes dominios o puertos. Esta separación de dominios puede generar problemas de seguridad, ya que los navegadores bloquean las solicitudes entre dominios no relacionados por razones de seguridad. Este bloqueo se llama política del mismo origen. CORS (Cross-Origin Resource Sharing) es un mecanismo que permite que los servidores controlen qué orígenes pueden acceder a sus recursos.

¿Por qué necesitas CORS?

Supongamos que tu aplicación frontend está ejecutándose en http://localhost:3000 y tu servidor backend está en http://localhost:5000. Si intentas realizar una solicitud desde el frontend al backend, por defecto el navegador bloqueará esa solicitud, ya que los dos dominios no son el mismo. Aquí es donde entra CORS: te permite especificar qué orígenes (dominios) pueden interactuar con tu servidor.

Instalación de CORS en Node.js

Para habilitar CORS en una aplicación Node.js con Express, primero debes instalar el paquete cors:

npm install cors

Luego, en tu archivo index.js, importa y usa el middleware cors():

const express = require("express");
const cors = require("cors"); // Importamos CORS
const app = express();
const PORT = 3000;

app.use(cors()); // Habilita CORS globalmente

app.get("/", (req, res) => {
  res.send("¡CORS está habilitado!");
});

app.listen(PORT, () => {
  console.log(`Servidor corriendo en http://localhost:${PORT}`);
});

Con este código, todas las solicitudes de cualquier origen estarán permitidas, lo que habilita CORS globalmente.

CORS con Opciones Personalizadas

A veces necesitas controlar más finamente qué orígenes pueden acceder a tu API. Por ejemplo, podrías querer permitir solicitudes solo desde http://localhost:5000. Para hacerlo, pasa un objeto de opciones a cors():

app.use(cors({
  origin: "http://localhost:5000", // Permite solo solicitudes desde este dominio
  methods: ["GET", "POST"], // Permite solo métodos GET y POST
  allowedHeaders: ["Content-Type"] // Permite solo el header Content-Type
}));

CORS en Rutas Específicas

Si prefieres habilitar CORS solo en rutas específicas, puedes hacerlo de la siguiente manera:

app.get("/api", cors(), (req, res) => {
  res.json({ message: "Acceso CORS permitido en esta ruta!" });
});

CORS Condicional

Si deseas permitir solicitudes solo de ciertos orígenes bajo ciertas condiciones, puedes crear una función personalizada para la opción origin:

app.use(cors({
  origin: (origin, callback) => {
    if (origin === "http://localhost:5000") {
      callback(null, true);
    } else {
      callback(new Error("No permitido por CORS"));
    }
  }
}));

Verificación de CORS en el Navegador

Para verificar que CORS esté funcionando correctamente, puedes usar herramientas como Postman o simplemente abrir el navegador y realizar una solicitud AJAX desde un dominio diferente.

Ejemplo usando Fetch:

fetch('http://localhost:3000/api')
.then(response => response.json())
.then(data => console.log(data))
.catch(error => console.log("Error:", error));