¿Cómo se solucionan los errores CORS de la API de API Gateway?

Descripción breve

Los errores de uso compartido de recursos entre orígenes (CORS) ocurren cuando un servidor no devuelve los encabezados HTTP que exige el estándar CORS. Para resolver un error CORS de una API de REST de API Gateway o API HTTP, debe configurar de nuevo la API para que cumpla con el estándar CORS.

Para obtener más información sobre la configuración de CORS para API de REST, consulte Habilitación de CORS para un recurso de la API de REST. Para API HTTP, consulte Configuración de CORS para una API HTTP.

Nota: CORS debe estar configurado en el nivel de recursos y se puede gestionar a través de las configuraciones de API Gateway o las integraciones backend, como AWS Lambda.

Resolución

El siguiente procedimiento de ejemplo muestra cómo solucionar el error de CORS No hay un encabezado ‘Access-Control-Allow-Origin’ presente. Sin embargo, puede utilizar un procedimiento similar para solucionar todos los errores CORS. Por ejemplo, los errores Method not supported under Access-Control-Allow-Methods header (Método no compatible en el encabezado Access-Control-Allow-Methods) y No ‘Access-Control-Allow-Headers’ headers present (No hay ningún encabezado ‘Access-Control-Allow-Headers’ presente).

Nota: El error No 'Access-Control-Allow-Origin' header present (No hay ningún encabezado 'Access-Control-Allow-Origin' presente) puede ocurrir por cualquiera de las siguientes razones:

• La API no está configurada con un método OPTIONS que devuelva los encabezados CORS necesarios.
• Cualquier otro tipo de método (como GET, PUT o POST) no está configurado para devolver los encabezados CORS necesarios.
• Una API con integración de proxy o integración que no es de proxy no está configurada para devolver los encabezados CORS necesarios.
• (En el caso de una API REST privada únicamente) Se llama a la URL de invocación incorrecta, o el tráfico no se dirige al punto de conexión de la nube privada virtual (VPC) de la interfaz.

Confirmar la causa del error

Hay dos maneras de confirmar la causa de un error CORS desde API Gateway:

• Cree un archivo HTTP Archive (HAR) al invocar la API. A continuación, confirme la causa del error en el archivo mediante la comprobación de los encabezados en los parámetros que ha devuelto la respuesta de la API.
  De forma alternativa, realice lo siguiente:
• Utilice las herramientas para desarrolladores en el navegador para comprobar los parámetros de solicitud y respuesta de la solicitud de API fallida.

Configure CORS en el recurso de API afectado por el error

Para las API de REST

Siga las instrucciones que aparecen en Habilitar CORS en un recurso mediante la consola de API Gateway.

Para las API HTTP

Siga las instrucciones que aparecen en Configurar CORS para una API HTTP.

Importante: Si configura CORS para una API HTTP, entonces API Gateway envía automáticamente una respuesta a las solicitudes OPTIONS previas. Esta respuesta se envía incluso si no hay una ruta OPTIONS configurada para la API. En el caso de una solicitud CORS, API Gateway agrega los encabezados CORS configurados a la respuesta desde una integración.

Al configurar CORS en el recurso de API, asegúrese de hacer lo siguiente:

• Para respuestas de la gateway para la API <api-name>, marque las casillas de verificación DEFAULT 4XX y DEFAULT 5XX.

Nota: Cuando seleccione estas opciones predeterminadas, API Gateway responde con los encabezados CORS necesarios, incluso cuando una solicitud no llega al punto de enlace. Por ejemplo, si una solicitud incluye una ruta de recurso incorrecta, API Gateway aún responde con el error 403 “Falta el token de autenticación”.

• En la opción Métodos, marque la casilla de verificación del método OPTIONS si aún no está seleccionada. Además, seleccione las casillas de verificación para el resto de métodos disponibles para solicitudes CORS. Por ejemplo: GET, PUT y POST.

Nota: Configurar CORS en la consola de API Gateway agrega un método OPTIONS al recurso si aún no existe uno. También configura la respuesta 200 del método OPTIONS con los encabezados Access-Control-Allow-* necesarios. Si ya ha configurado CORS a través de la consola, al configurarlo de nuevo se sobrescriben los valores existentes.

Configure las integraciones de la API REST de modo que devuelvan los encabezados CORS requeridos

Configure la función de AWS Lambda de backend o servidor HTTP para enviar los encabezados CORS necesarios en su respuesta. Tenga en cuenta lo siguiente:

• Los dominios permitidos se deben incluir en el valor del encabezado Access-Control-Allow-Origin como una lista.
• Para las integraciones de proxy, no puede configurar una respuesta de integración en API Gateway para modificar los parámetros de respuesta que devuelve el backend de la API. En una integración de proxy, API Gateway envía la respuesta de backend directamente al cliente.
• Si utiliza una integración que no es de proxy, debe configurar de manera manual una respuesta de integración en API Gateway para devolver los encabezados CORS necesarios.

Nota: Para las API con una integración que no es de proxy, configurar CORS en un recurso mediante la consola de API Gateway agrega de manera automática los encabezados CORS necesarios al recurso.

(Únicamente para las API REST privadas) Verifique la configuración de DNS privada del punto de conexión de la interfaz

En el caso de las API de REST privadas, determine si el DNS privado está activado en el punto de conexión de VPC de interfaz asociado.

Si el DNS privado está activado

Asegúrese de invocar a la API privada desde Amazon Virtual Private Cloud (Amazon VPC) con el nombre de DNS privado.

Si el DNS privado no está activado

Debe dirigir el tráfico de forma manual desde la URL de invocación a las direcciones IP del punto de conexión de VPC.

Nota: Debe utilizar la siguiente URL de invocación, tanto si el DNS privado está activado como si no:

https://api-id.execute-api.region.amazonaws.com/stage-name

Asegúrese de que sustituye los valores de api-id, región y stage-name por los valores requeridos para la API. Para obtener más información, consulte Cómo invocar una API privada.

Importante: Si CORS está configurado cuando el DNS privado no está activado, tenga en cuenta las siguientes limitaciones:

• No puede utilizar nombres de DNS públicos específicos de puntos de conexión para acceder a la API privada desde Amazon VPC.
• No puede utilizar la opción de encabezado Alojamiento, puesto que las solicitudes desde un navegador no permiten la manipulación de encabezados de Alojamiento.
• No puede utilizar el encabezado personalizado x-apigw-api-id, puesto que este inicia una solicitud OPTIONS preliminar que no incluye el encabezado. Las llamadas a la API que utilizan el encabezado x-apigw-api-id no llegarán a la API.

Información relacionada

Probar CORS

Habilitar CORS en un recurso mediante la característica Importar API de API Gateway