¿Cómo puedo solucionar los errores de CORS de mi API de API Gateway?

5 minutos de lectura
0

Cuando intento invocar mi API de Amazon API Gateway, aparece el error «No "Access-Control-Allow-Origin" header is present on the requested resource». Quiero solucionar este y otros errores de CORS de API Gateway.

Descripción breve

Los errores de uso compartido de recursos entre orígenes (CORS) se producen cuando un servidor no devuelve los encabezados HTTP que el estándar CORS necesita. Para solucionar un error de CORS de una API de REST o una API HTTP en API Gateway, debe volver a configurar la API para que cumpla con el estándar CORS.

Nota: Debe configurar CORS a nivel de recurso. Utilice configuraciones de API Gateway o integraciones de backend, como AWS Lambda.

Resolución

Puede utilizar el siguiente procedimiento para solucionar todos los errores de CORS, además del error de CORS No 'Access-Control-Allow-Origin' header present. Otros errores de CORS abarcan Method not supported under Access-Control-Allow-Methods header y No 'Access-Control-Allow-Headers' headers present.

El error No 'Access-Control-Allow-Origin' header present puede deberse a los siguientes motivos:

  • No ha configurado la API con un método OPTIONS que devuelva los encabezados de CORS necesarios.
  • No ha configurado otro topo de método, como GET, PUT o POST, para que devuelva los encabezados de CORS necesarios.
  • No ha configurado una API con integración de proxy o que no sea de proxy para que devuelva los encabezados de CORS necesarios.
  • En el caso de las API REST privadas, se llama a la URL de invocación incorrecta. O bien, el tráfico no se dirige al punto de enlace de la nube virtual privada (VPC) de la interfaz.

Confirmación de la causa del error

Haga lo siguiente:

  • Cuando invoque la API, cree un archivo HTTP Archive (HAR). A continuación, compruebe los encabezados de los parámetros que se devuelven en la respuesta de la API para confirmar la causa del error del archivo.
  • Use las herramientas de desarrollador del navegador para comprobar los parámetros de solicitud y respuesta de la solicitud de API fallida.

Configuración de CORS en el recurso de la API que da error

En el caso de las API de REST

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

En el caso de las API HTTP

Siga las instrucciones que se indican en Configuración de CORS de las API de HTTP en API Gateway.

Al configurar CORS en su recurso de API, seleccione las siguientes opciones:

Para las respuestas de Gateway, seleccione DEFAULT 4XX y DEFAULT 5XX. Si selecciona DEFAULT 4XX y DEFAULT 5XX, API Gateway responde con los encabezados CORS necesarios, incluso cuando una solicitud no llegue al punto de enlace. Por ejemplo, si una solicitud incluye una ruta de recursos incorrecta, API Gateway seguirá respondiendo con el error 403: «Missing Authentication Token».

En el caso de Access-Control-Allow-Methods, si no se ha seleccionado OPTIONS, selecciónelo junto con el resto de métodos que estén disponibles para las solicitudes CORS, como GET, PUT y POST. La consola de API Gateway configura la respuesta 200 del método OPTIONS con los encabezados Access-Control-Allow necesarios y sobrescribe los valores existentes en el recurso reconfigurado.

Configuración de las integraciones de la API de REST de modo que devuelvan los encabezados de CORS necesarios

Para devolver los encabezados CORS necesarios en su respuesta, configure la función de Lambda o servidor HTTP de su backend. Debe incluir los dominios permitidos en el valor del encabezado Access-Control-Allow-Origin en forma de lista.

En el caso de 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 reenvía la respuesta del backend directamente al cliente.

Para integraciones que no sean de proxy, deberá configurar manualmente una respuesta de integración en API Gateway para devolver los encabezados de CORS necesarios. Utilice la consola de API Gateway para configurar CORS, ya que la consola agrega automáticamente los encabezados CORS necesarios al recurso configurado.

(Solo en el caso de las API de REST privadas) Comprobación de la configuración del DNS privado del punto de enlace de la interfaz

En el caso de las API de REST privadas, averigüe si el DNS privado está activado en el punto de enlace de VPC de la interfaz asociado.

Si el DNS privado está activado

Utilice el nombre de DNS privado para llamar a su API privada desde Amazon Virtual Private Cloud (Amazon VPC).

Si el DNS privado no está activado

Deberá enrutar el tráfico manualmente desde la URL de invocación a las direcciones IP del punto de enlace de VPC. Utilice la siguiente URL de invocación (alias de Route53):

https://{rest-api-id}-{vpce-id}.execute-api.{region}.amazonaws.com/{stage}

Nota: Sustituya rest-api-id, region, vpce-id y stage por los valores de su API. Para obtener más información, consulte Llamada a una API privada.

Si el DNS privado no está activado, no puede usar nombres de DNS públicos específicos del punto de enlace para acceder a su API privada desde Amazon VPC. Además, no puede usar la opción de encabezado Host porque las solicitudes desde un navegador no permiten modificar el encabezado Host.

En las API privadas, no puede usar el encabezado personalizado x-apigw-api-id porque inicia una solicitud OPTIONS preliminar que no incluye el encabezado. Las llamadas a la API con el encabezado x-apigw-api-id no llegan a su API.

Nota: Asegúrese de que la autorización esté desactivada en el método OPTIONS de su API.

Información relacionada

Prueba de CORS

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