Restreindre ou autoriser le partage de ressources entre sites à l'aide de l'en-tête CORS.
L'en-tête CORS (Cross-Origin Resource Sharing) est pris en charge sur tous les navigateurs modernes.
Par défaut, le navigateur limite les requêtes HTTP d'origine croisée via des scripts. Et, CORS peut être pratique pour réutiliser les ressources d'application communes sur d'autres applications Web. Une fois qu'il est correctement ajouté, il demande au navigateur de charger l'application à partir d'une autre origine.
Il existe six types d'en-têtes CORS courants qu'un serveur peut envoyer. Explorons-les.
Access-Control-Allow-Origin
Le plus populaire, il indique au navigateur de charger les ressources sur l'origine autorisée. Il prend en charge le caractère générique (*) et, ce faisant, tout domaine peut charger les ressources. Cependant, il a une option pour autoriser une origine spécifique.
Apache
Ajoutez ce qui suit dans httpd.conf
ou tout autre fichier de configuration en cours d'utilisation.
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 à partir d'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 server
bloc de nginx.conf
ou fichier de configuration en cours d'utilisation.
add_header Access-Control-Allow-Origin "https://geekflare.dev";
Access-Control-Allow-Methods
Le navigateur peut lancer une ou plusieurs méthodes HTTP pour accéder aux ressources. Ex: - GET, PUT, OPTIONS, PUT, DELETE, POST
Apache
Pour autoriser uniquement GET et POST.
Header add Access-Control-Allow-Methods "GET, POST"
Nginx
Disons que vous devez ajouter les méthodes DELETE et OPTIONS, puis vous pouvez ajouter comme ci-dessous.
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.
Access-Control-Allow-Headers
Les en-têtes suivants sont dans la liste sûre, vous n'avez donc pas besoin d'en ajouter un. Cela devrait fonctionner par défaut.
- Content-Type
- Accepter
- Contenu Langue
- Accept-Language
Cependant, si vous devez en ajouter un personnalisé, vous pouvez le faire. Il prend en charge un ou plusieurs en-têtes.
Apache
Disons que vous voulez autoriser X-Custom-Header
et X-Powered-By
En-têtes.
Header always set 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
Un exemple d'ajout de X-Customer-Software et d'en-tête X-My-Custom.
add_header Access-Control-Allow-Headers "X-Custom-Software, X-My-Custom";
Access-Control-Expose-Headers
Les en-têtes suivants sont déjà une liste sûre. Cela signifie que vous n'avez pas besoin d'ajouter si vous souhaitez les exposer.
- Expire le
- Pragma
- Cache-Control
- Last-Modified
- Contenu Langue
- Content-Type
Mais, si vous avez besoin d'autres que la liste sûre, vous pouvez les autoriser comme suit.
Apache
Utilisez un caractère générique pour exposer tous les en-têtes.
Header always set Access-Control-Expose-Headers "*"
Remarque: un caractère générique n'expose toujours pas Authorization
header, 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 Origin
en-tête.
add_header Access-Control-Expose-Headers "Origin";
Access-Control-Max-Age
Connaissez-vous les données de Access-Control-Allow-Headers
et Access-Control-Allow-Methods
les en-têtes peuvent être mis en cache? Il peut être mis en cache jusqu'à 24 heures dans Firefox, 2 heures dans Chrome (76+).
Pour désactiver la mise en cache, vous pouvez conserver la valeur comme -1
Apache
Mettre en cache pendant 15 minutes.
Header always set Access-Control-Max-Age "900"
Comme vous pouvez le voir, la valeur est en secondes.
Nginx
Mettre en cache pendant une heure.
add_header Access-Control-Max-Age "3600";
Une fois ajouté, redémarrez Nginx pour voir les résultats.
Access-Control-Allow-Credentials
Il n'y a qu'une seule option à définir ici - true. This
est d'autoriser si vous souhaitez exposer des informations d'identification telles que les cookies, les certificats TLS, l'autorisation.
Apache
Header always set Access-Control-Allow-Credentials "true"
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ête HTTP en ligne.
Conclusion
J'espère que ce qui précède vous aidera à implémenter l'en-tête CORS dans Apache HTTP et le serveur Web Nginx pour une meilleure sécurité. Vous pourriez également être intéressé à postuler En-têtes sécurisés recommandés par OWASP.