Restreindre ou autoriser le partage des ressources entre les sites à l’aide de l’en-tête CORS.

L’en-tête CORS (Cross-Origin Resource Sharing) est pris en charge par tous les navigateurs modernes.

Puis-je utiliser cors ? Données sur la prise en charge de la fonctionnalité cors par les principaux navigateurs sur caniuse.com.

Par défaut, le navigateur limite les requêtes HTTP inter-origines par le biais de scripts. CORS peut s’avérer pratique pour réutiliser les ressources communes d’une application sur d’autres applications web. Une fois qu’il est correctement ajouté, il demande au navigateur de charger l’application à partir d’une origine différente.

Il existe six types d’en-têtes CORS qu’un serveur peut envoyer. Explorons-les.

Contrôle d’accès – Autoriser l’origine

L’en-tête le plus populaire indique au navigateur de charger les ressources sur l’origine autorisée. Il prend en charge les caractères génériques (*), ce qui permet à n’importe quel domaine de charger les ressources. Cependant, il existe une option permettant d’autoriser une origine spécifique.

Apache

Ajoutez ce qui suit à httpd.conf ou à tout autre fichier de configuration utilisé.

Header set Access-Control-Allow-Origin "*"

Redémarrez Apache pour tester. Vous devriez les voir dans les en-têtes de réponse.

Et, pour autoriser une origine spécifique (ex : https://gf.dev), vous pouvez utiliser ce qui suit.

Header set Access-Control-Allow-Origin "https://gf.dev"

Nginx

Voici un exemple pour autoriser l’origine https://geekflare.dev. Ajoutez ce qui suit dans le bloc serveur de nginx.conf ou dans le fichier de configuration en cours d’utilisation.

add_header Access-Control-Allow-Origin "https://geekflare.dev" ;

Contrôle d’accès-Autoriser-Méthodes

Le navigateur peut lancer une ou plusieurs méthodes HTTP pour accéder aux ressources. Ex : – GET, PUT, OPTIONS, PUT, DELETE, POST

Apache

Pour n’autoriser que GET et POST.

Ajouter l'en-tête Access-Control-Allow-Methods "GET, POST"

Nginx

Supposons que vous ayez besoin d’ajouter les méthodes DELETE et OPTIONS, vous pouvez alors procéder comme suit.

add_header Access-Control-Allow-Methods "DELETE, OPTIONS" ;

Après le redémarrage, vous devriez les voir dans les en-têtes de réponse.

Contrôle d’accès – Autoriser les en-têtes

Les en-têtes suivants sont dans la liste de sécurité, ce qui signifie que vous n’avez pas besoin d’en ajouter. Ils devraient fonctionner par défaut.

  • Content-Type
  • Accepter
  • Langue du contenu
  • Accepter la langue

Cependant, si vous avez besoin d’en ajouter un personnalisé, vous pouvez le faire. Il prend en charge un ou plusieurs en-têtes.

Apache

Supposons que vous souhaitiez autoriser les en-têtes X-Custom-Header et X-Powered-By.

L'en-tête définit toujours Access-Control-Allow-Headers "X-Custom-Header, X-Powered-By"

Après un redémarrage, vous devriez voir le résultat dans les en-têtes de réponse.

Nginx

Exemple d’ajout des en-têtes X-Customer-Software et X-My-Custom.

add_header Access-Control-Allow-Headers "X-Customer-Software, X-My-Custom" ;

En-tête Access-Control-Expose

Les en-têtes suivants constituent déjà une liste sûre. Vous n’avez donc pas besoin de les ajouter si vous souhaitez les exposer.

  • Expires
  • Pragma
  • Cache-Control
  • Dernière modification
  • Langue du contenu
  • Type de contenu

Mais si vous avez besoin d’autres éléments que ceux de la liste de sécurité, vous pouvez les autoriser comme suit.

Apache

Utilisez un joker pour exposer tous les en-têtes.

L'en-tête est toujours défini sur Access-Control-Expose-Headers "*"

Note : un joker n’expose toujours pas l’en-tête Authorization, et si vous en avez besoin, vous devez le mentionner explicitement.

Header always set Access-Control-Expose-Headers "Authorization, *"

Le résultat devrait ressembler à ceci.

Nginx

Si vous voulez exposer l’en-tête Origin.

add_header Access-Control-Expose-Headers "Origin" ;

Contrôle d’accès-Max-Age

Savez-vous que les données des en-têtes Access-Control-Allow-Headers et Access-Control-Allow-Methods peuvent être mises en cache ? Elles peuvent être mises en cache pendant 24 heures dans Firefox, 2 heures dans Chrome (76 ).

Pour désactiver la mise en cache, vous pouvez conserver la valeur -1

Apache

Pour mettre en cache pendant 15 minutes.

L'en-tête définit toujours Access-Control-Max-Age "900"

Comme vous pouvez le constater, la valeur est exprimée en secondes.

Nginx

Pour mettre en cache pendant une heure.

add_header Access-Control-Max-Age "3600" ;

Une fois ajouté, redémarrez Nginx pour voir les résultats.

Contrôle d’accès – Autoriser les informations d’identification

Il n’y a qu’une seule option à définir ici – true. Il s’agit d’autoriser si vous souhaitez exposer des informations d’identification telles que des cookies, des certificats TLS, des autorisations.

Apache

L'en-tête définit toujours Access-Control-Allow-Credentials "true" (contrôle d'accès - autoriser les informations d'identification)

Nginx

add_header Access-Control-Allow-Credentials "true" ;

et le résultat.

Vérification des résultats

Une fois les en-têtes nécessaires ajoutés, vous pouvez utiliser les outils de développement intégrés au navigateur ou un vérificateur d’en-têtes HTTP en ligne.

Conclusion

J’espère que ce qui précède vous aidera à mettre en œuvre l’en-tête CORS dans Apache HTTP et le serveur web Nginx pour une meilleure sécurité. Vous pouvez également être intéressé par l’application des en-têtes sécurisés recommandés par l’OWASP.