Comment résoudre les erreurs CORS à partir de mon API Gateway ?

Dernière mise à jour : 04-04-2022

J'obtiens l'erreur « No 'Access-Control-Allow-Origin' header is present on the requested resource » (Aucun en-tête Access-Control-Allow-Origin présent dans la ressource demandée) lorsque j'essaie d'appeler mon API Amazon API Gateway. Comment résoudre cette erreur et d'autres erreurs CORS à partir d'API Gateway ?

Brève description

Des erreurs de partage des ressources entre origines (CORS, Cross-Origin Resource Sharing) se produisent lorsqu'un serveur ne renvoie pas les en-têtes HTTP requis par la norme CORS. Pour résoudre une erreur CORS à partir d'une API API Gateway REST ou API HTTP, vous devez reconfigurer l'API pour qu'elle réponde à la norme CORS.

Pour plus d'informations sur la configuration CORS pour les API REST, consultez Configuration de CORS pour une ressource API REST. Pour les API HTTP, consultez Configuration de CORS pour une API HTTP.

Remarque : CORS doit être configuré au niveau des ressources et peut être géré à l'aide de configurations API Gateway ou d'intégrations backend, comme AWS Lambda.

Résolution

L'exemple de procédure suivant montre comment résoudre l'erreur CORS Aucun en-tête « Access-Control-Allow-Origin » présent. Toutefois, vous pouvez utiliser une procédure similaire pour résoudre toutes les erreurs CORS. Par exemple : les erreurs Méthode non prise en charge sous l'en-tête « Access-Control-Allow-Methods » erreurs d'en-tête et les erreurs Aucun en-tête « Access-Control-Allow-Headers » présent.

Remarque : l'erreur Aucun en-tête « Access-Control-Allow-Origin » présent peut se produire pour l'une des raisons suivantes :

  • L'API n'est pas configurée avec une méthode OPTIONS qui renvoie les en-têtes CORS requis.
  • Un autre type de méthode (tel que GET, PUT ou POST) n'est pas configuré pour renvoyer les en-têtes CORS requis.
  • Une API avec intégration proxy ou intégration non-proxy n'est pas configurée pour renvoyer les en-têtes CORS requis.
  • (Pour une API REST privée uniquement) L'URL d'appel incorrecte est appelée ou le trafic n'est pas acheminé vers le point de terminaison de cloud privé virtuel (VPC) de l'interface.

Confirmer la cause de l'erreur

Il existe deux façons de confirmer la cause d'une erreur CORS depuis API Gateway :

  • Créez un fichier d'archive HTTP (HAR) lorsque vous appelez votre API. Ensuite, confirmez la cause de l'erreur dans le fichier en vérifiant les en-têtes dans les paramètres renvoyés dans la réponse API.
    -ou-
  • Utilisez les outils pour développeur de votre navigateur pour vérifier les paramètres de demande et de réponse provenant de la demande d'API qui a échoué.

Configurer CORS sur votre ressource API qui rencontre l'erreur

Pour les API REST

Suivez les instructions de la section Configurer CORS sur une ressource à l'aide de la console API Gateway.

Pour les API HTTP

Suivez les instructions de la section Configuration de CORS pour une API HTTP.

Important : si vous configurez CORS pour une API HTTP, API Gateway envoie alors automatiquement une réponse aux requêtes OPTIONS en amont. Cette réponse est envoyée même si aucun acheminement OPTIONS n'est configuré pour votre API. Pour une requête CORS, API Gateway ajoute les en-têtes CORS configurés à la réponse d'une intégration.

Lors de la configuration de CORS sur votre ressource API, assurez-vous d'effectuer les opérations suivantes :

  • Pour les réponses de passerelle pour l'API <nom-api>, cochez les cases DEFAULT 4XX et DEFAULT 5XX.

Remarque : lorsque vous sélectionnez ces options par défaut, API Gateway répond avec les en-têtes CORS requis, même lorsqu'une requête n'atteint pas le point de terminaison. Par exemple, si une demande inclut un chemin de ressource incorrect, API Gateway répond toujours avec une erreur 403 « Missing Authentication Token » (Jeton d'authentification manquant).

  • Pour les méthodes, cochez la case de la méthode OPTIONS si elle n'est pas déjà sélectionnée. Cochez également les cases pour toutes les autres méthodes disponibles pour les demandes CORS. Par exemple : GET, PUT et POST.

Remarque : la configuration de CORS dans la console API Gateway ajoute une méthode OPTIONS à la ressource si elle n'existe pas déjà. Elle configure également la réponse 200 de la méthode OPTIONS avec les en-têtes Access-Control-Allow-* requis. Si vous avez déjà configuré CORS à l'aide de la console, sa nouvelle configuration remplace toutes les valeurs existantes.

Configurer vos intégrations d'API REST pour renvoyer les en-têtes CORS requis

Configurez votre fonction AWS Lambda backend ou votre serveur HTTP pour envoyer les en-têtes CORS requis dans sa réponse. Gardez à l'esprit les points suivants :

  • Les domaines autorisés doivent être inclus dans la valeur d'en-tête Access-Control-Allow-Origin sous forme de liste.
  • Pour les intégrations proxy, vous ne pouvez pas configurer de réponse d'intégration dans API Gateway pour modifier les paramètres de réponse renvoyés par le backend de votre API. Dans une intégration proxy, API Gateway transfère la réponse backend directement au client.
  • Si vous utilisez une intégration non proxy, vous devez configurer manuellement une réponse d'intégration dans API Gateway pour renvoyer les en-têtes CORS requis.

Remarque : pour les API avec une intégration non proxy, la configuration de CORS sur une ressource à l'aide de la console API Gateway ajoute automatiquement les en-têtes CORS requis à la ressource.

(Pour les API REST privées uniquement) Vérifier le paramètre DNS privé de votre point de terminaison d'interface

Pour les API REST privées, déterminez si le DNS privé est activé sur le point de terminaison d'un VPC d'interface associé.

Si le DNS privé est activé

Assurez-vous d'appeler votre API privée depuis votre Amazon Virtual Private Cloud (Amazon VPC) en utilisant le nom de DNS privé.

Si le DNS privé n'est pas activé

Vous devez acheminer manuellement le trafic depuis l'URL d'appel vers les adresses IP du point de terminaison d'un VPC.

Remarque : vous devez utiliser l'URL d'appel suivante, que le DNS privé soit activé ou non :

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

Assurez-vous de remplacer les valeurs pour api-id, regionet stage-name par les valeurs requises pour votre API. Pour plus d'informations, consultez Procédure d'appel d'une API privée.

Important : si CORS est configuré lorsque le DNS privé n'est pas activé, souvenez-vous des limitations suivantes :

  • Vous ne pouvez pas utiliser de noms DNS publics spécifiques aux points de terminaison pour accéder à votre API privée depuis votre Amazon VPC.
  • Vous ne pouvez pas utiliser l'option d'en-tête Host, car les requêtes provenant d'un navigateur n'autorisent pas la manipulation de l'en-tête Host.
  • Vous ne pouvez pas utiliser l'en-tête personnalisé x-apigw-api-id, car il lance une requête OPTIONS en amont qui n'inclut pas l'en-tête. Les appels d'API qui utilisent l'en-tête x-apigw-api-id n'atteindront pas votre API.

Cet article vous a-t-il été utile ?


Besoin d'aide pour une question technique ou de facturation ?