Depurador de Errores CORS — Herramienta Gratuita en Línea

Diagnostique errores de cross-origin resource sharing y obtenga código de solución listo para usar en 10 frameworks de backend.

¿Qué es CORS?

Cross-Origin Resource Sharing (CORS) es un mecanismo de seguridad del navegador que restringe las páginas web de realizar solicitudes a un dominio diferente del que sirvió la página. Cuando su frontend (ej., https://miapp.com) hace una llamada a una API en un dominio diferente (ej., https://api.ejemplo.com), el navegador primero verifica si el servidor lo permite explícitamente.

Si el servidor no incluye los encabezados Access-Control-Allow-Origin apropiados en su respuesta, el navegador bloquea la solicitud y lanza un error CORS. Es importante destacar que CORS es aplicado por el navegador — la solicitud sí llega a su servidor, pero el navegador impide que el JavaScript lea la respuesta.

Errores CORS comunes

  • Falta el encabezado 'Access-Control-Allow-Origin': La respuesta del servidor no incluye el encabezado CORS en absoluto. Solución: agregue el encabezado a la respuesta de su servidor.
  • La solicitud preflight no pasa: Para solicitudes con encabezados personalizados o métodos no simples (PUT, DELETE), los navegadores envían una solicitud preflight OPTIONS. Su servidor debe responder correctamente a esta solicitud.
  • Indicador de credenciales: Al usar cookies o encabezados Authorization con withCredentials: true, el servidor debe devolver Access-Control-Allow-Credentials: true y el origen debe ser específico (no *).
  • Desajuste de encabezados permitidos: Si su solicitud incluye un encabezado que no está listado en Access-Control-Allow-Headers, el preflight falla.

Cómo solucionar CORS por framework

Use la herramienta de arriba para generar la solución exacta para su backend. El principio general es el mismo en todos los frameworks: configure su servidor para devolver los encabezados Access-Control-Allow-* apropiados. En producción, siempre especifique los orígenes permitidos exactos en lugar de usar un comodín (*), especialmente cuando se trata de solicitudes autenticadas.

Preguntas frecuentes sobre CORS

¿Qué causa un error CORS?

Un error CORS ocurre cuando un navegador bloquea una solicitud de origen cruzado porque la respuesta del servidor no incluye el encabezado Access-Control-Allow-Origin. El navegador aplica la Política del Mismo Origen — cualquier solicitud desde un dominio, puerto o protocolo diferente activa una verificación preflight CORS. Es importante destacar que CORS es aplicado solo por el navegador; la solicitud sí llega a su servidor, pero el navegador impide que el JavaScript lea la respuesta.

¿Cómo soluciono CORS en Express.js?

Instale el paquete cors (npm install cors) y agregue app.use(cors()) para permitir todos los orígenes, o especifique orígenes exactos: app.use(cors({ origin: 'https://sudominio.com' })). Para solicitudes con cookies o encabezados Authorization, configure credentials: true y nunca use un comodín (*) como origen permitido — debe especificar el dominio exacto.

¿Qué es una solicitud preflight CORS?

Un preflight es una solicitud HTTP OPTIONS que el navegador envía automáticamente antes de solicitudes de origen cruzado que usan encabezados personalizados o métodos HTTP no simples (PUT, DELETE, PATCH). El servidor debe responder a OPTIONS con los encabezados Access-Control-Allow-Methods y Access-Control-Allow-Headers, además de un estado 200 o 204. Si el preflight falla, la solicitud real nunca se envía.

¿Por qué CORS funciona en Postman pero no en el navegador?

CORS es un mecanismo de seguridad del navegador — no se aplica a la comunicación servidor-a-servidor o herramientas como Postman, curl o clientes REST. Postman envía solicitudes directamente sin aplicar la política del mismo origen, por lo que la solicitud tiene éxito. En el navegador, JavaScript está restringido de leer respuestas de origen cruzado a menos que el servidor lo permita explícitamente mediante encabezados CORS.

Herramientas relacionadas para desarrolladores