Article original : How to Host a Static Website on AWS S3 and CloudFront
DevOps peut sembler être un domaine complexe avec diverses spécialisations et outils. Dans cet article, je vais simplifier un aspect clé en démontrant comment héberger un site web statique en utilisant Amazon S3 (Simple Storage Service) et CloudFront, le réseau de diffusion de contenu (CDN) d'AWS qui met en cache et distribue le contenu efficacement pour un accès plus rapide.
Pour suivre ce guide, vous devez avoir :
Un compte AWS.
Une compréhension de base de l'architecture AWS (Vous pouvez obtenir des informations ici.)
Des connaissances sur AWS IAM (Identity and Access Management pour le contrôle d'accès sécurisé aux ressources)
Une familiarité avec Git et GitHub
Plongeons-nous et configurons notre hébergement de site statique étape par étape.
Table des matières :
Qu'est-ce qu'AWS S3 ?
Amazon Simple Storage Service (Amazon S3) est un service de stockage d'objets conçu pour stocker et récupérer n'importe quelle quantité de données depuis n'importe où.
L'utilisation d'Amazon S3 est simple. Vous commencez par sélectionner une région, créer un conteneur de stockage appelé "bucket", puis téléverser vos données. Il n'y a pas de limite à la quantité de données que vous pouvez stocker, et vous pouvez les récupérer à tout moment.
Amazon S3 crée automatiquement des sauvegardes de vos données en stockant des copies sur plusieurs appareils. Il vous permet également de conserver différentes versions de vos fichiers, vous aidant à récupérer des données si elles sont accidentellement perdues. Si vous supprimez un fichier par erreur, vous pouvez le restaurer en utilisant la fonctionnalité de versioning d'Amazon S3.
Amazon S3 offre des politiques de cycle de vie configurables pour aider à gérer les données efficacement tout au long de leur cycle de vie. La sécurité est une priorité absolue pour AWS, garantissant que les téléversements et récupérations de données sont protégés en utilisant le chiffrement SSL pour une transmission sécurisée. AWS fournit également plusieurs fonctionnalités de sécurité pour protéger vos données, y compris des contrôles d'accès granulaires et le chiffrement au repos. Explorons ces deux fonctionnalités en un peu plus de détail.
Contrôles d'accès granulaires dans S3
Amazon S3 fournit un contrôle d'accès granulaire, vous permettant de définir qui peut accéder à vos données et quelles actions ils peuvent effectuer. Cela est géré via :
AWS Identity and Access Management (IAM) : Contrôle les permissions des utilisateurs au niveau du compte AWS. Vous pouvez accorder à des utilisateurs ou rôles spécifiques des permissions pour accéder à S3.
Politiques de bucket S3 : Politiques basées sur JSON appliquées au niveau du bucket pour contrôler l'accès à tous les objets dans un bucket.
Listes de contrôle d'accès (ACL) : Définit les permissions pour des objets individuels au sein d'un bucket (moins couramment utilisé depuis que les politiques de bucket sont plus puissantes).
Paramètres de blocage de l'accès public : Empêche l'exposition publique accidentelle des données S3 en restreignant l'accès ouvert.
Chiffrement au repos dans S3
Le chiffrement au repos garantit que les données stockées restent sécurisées, même en cas d'accès non autorisé. S3 prend en charge plusieurs options de chiffrement :
Chiffrement côté serveur (SSE) :
SSE-S3 : AWS gère automatiquement les clés de chiffrement.
SSE-KMS : Utilise AWS Key Management Service (KMS) pour un contrôle supplémentaire sur les clés de chiffrement.
SSE-C : Les clients fournissent leurs propres clés de chiffrement.
Chiffrement côté client :
Les données sont chiffrées avant d'être téléversées vers S3 en utilisant des clés de chiffrement gérées par le client.
Nous pourrions passer un temps infini à rechercher et explorer la théorie derrière Amazon S3, mais l'application pratique solidifie l'apprentissage. Maintenant, passons au téléversement d'un site web statique vers Amazon S3.
Comme mentionné précédemment, vous devez avoir une compréhension de base du fonctionnement d'AWS, y compris l'inscription, la connexion et la création d'utilisateurs IAM. Cela est crucial car nous utiliserons un utilisateur IAM pour effectuer des opérations de manière sécurisée. Comprendre Identity and Access Management est essentiel dans AWS, car il garantit un contrôle d'accès et une sécurité appropriés lors de la gestion des ressources.
Comment téléverser un site web statique sur Amazon S3
Pour téléverser un site web statique, vous avez d'abord besoin d'un site statique. Si vous n'en avez pas, vous pouvez utiliser un modèle gratuit de Free CSS.
J'ai également fourni un modèle prêt à l'emploi que vous pouvez cloner depuis ce dépôt GitHub : Mediplus Free Template.
Maintenant que votre projet statique est prêt, allons sur AWS et téléversons-le vers un bucket Amazon S3.
Connectez-vous à votre compte AWS en utilisant vos identifiants d'utilisateur IAM. Une fois connecté, vous serez redirigé vers la Console de gestion AWS.
Votre tableau de bord AWS devrait ressembler à ceci :
Accédez au service S3 en cliquant sur le lien S3 dans le tableau de bord AWS. Si vous ne le voyez pas, ce qui est peu probable, utilisez la barre de recherche en haut du tableau de bord. Tapez simplement "S3", et il apparaîtra dans les résultats. Cliquez dessus pour continuer.
Une fois que vous arrivez sur la page Amazon S3, vous verrez le bouton Créer un bucket.
Les buckets S3 sont la pierre angulaire de nombreuses applications, y compris la diffusion de contenu, la sauvegarde de données, l'archivage, l'hébergement de sites web statiques et le stockage de big data pour l'analyse.
Qu'est-ce qu'un bucket ?
Les buckets Amazon S3 sont les conteneurs de stockage fondamentaux au sein du service Amazon Simple Storage Service qui fournissent des référentiels sécurisés et évolutifs pour les actifs numériques.
Chaque bucket possède un nom globalement unique, un déploiement régional et une architecture de stockage d'objets plate identifiée par des clés uniques.
Avec une durabilité de 99,999999999 % grâce à la redondance intégrée, les buckets S3 prennent en charge les besoins cruciaux de l'infrastructure, y compris la distribution de contenu, l'archivage de données et l'hébergement de sites web statiques. Les administrateurs peuvent mettre en œuvre une gouvernance complète des données grâce à des contrôles d'accès configurables (politiques, ACL, IAM), des capacités de gestion du cycle de vie, de versioning et des protocoles de chiffrement pour répondre aux exigences de sécurité organisationnelles.
Comment créer un bucket
Pour créer un bucket, cliquez sur le bouton "Créer un bucket". Vous serez alors redirigé vers la page de création de bucket.
Choisissez n'importe quel nom que vous aimez, tant qu'il suit les règles de nommage des buckets AWS.
Vous verrez également diverses options de configuration, mais pour l'instant, laissez-les par défaut. Nous apporterons les ajustements nécessaires plus tard dans le projet.
Enfin, cliquez sur "Créer un bucket", et voilà, votre bucket est créé ! Vous devriez maintenant voir votre bucket, qui agit comme un conteneur pour stocker vos fichiers ou données :
Comment téléverser des fichiers et dossiers vers un bucket S3
Maintenant, téléversons le site statique que nous avons créé ou clonné vers notre bucket S3.
1. Cliquez sur votre bucket :
Après avoir cliqué sur votre bucket, vous serez redirigé vers la page des détails du bucket, où vous pouvez gérer divers paramètres et configurations. Cette page fournit des options pour ajuster les permissions et propriétés, surveiller les métriques, gérer les points d'accès et téléverser des fichiers en utilisant le bouton "Téléverser".
2. Télécharger les fichiers du projet :
Si votre projet de site statique est prêt, il devrait contenir les fichiers essentiels nécessaires pour le déploiement. Bien que la structure puisse varier, elle devrait inclure un fichier index.html, ainsi que les actifs nécessaires tels que des images (ou un dossier d'images), des fichiers CSS (ou un dossier CSS) et des fichiers JavaScript (ou un dossier JS) pour assurer un fonctionnement et un style appropriés.
Commençons par téléverser les fichiers nécessaires selon la structure de notre projet. Commencez par les fichiers de niveau racine tels que index.html, ainsi que tout autre fichier essentiel au niveau racine. Assurez-vous de suivre attentivement la structure de votre projet et téléversez d'abord tous les fichiers requis pour maintenir une structure appropriée.
Ensuite, cliquez sur le bouton de téléversement :
Sur la page de téléversement, vous verrez les boutons "Ajouter des fichiers" et "Ajouter un dossier". Commençons par téléverser des fichiers individuels. Cliquez sur "Ajouter des fichiers" pour commencer à sélectionner et téléverser les fichiers nécessaires.
Après avoir téléversé vos fichiers avec succès, assurez-vous de suivre la structure de votre projet. Si votre site statique ne nécessite que des fichiers individuels, procédez en conséquence. Mais si votre projet dépend de dossiers spécifiques pour des actifs comme des images et du CSS, vous devrez téléverser ceux-ci également. Dans mon cas, la structure de mon projet inclut des dossiers pour les images et le CSS, etc., donc je vais téléverser à la fois des fichiers et des dossiers.
3. Télécharger les dossiers du projet
Pour téléverser vos dossiers, cliquez sur le bouton "Ajouter un dossier".
Maintenant, téléversez vos dossiers en cliquant sur le bouton "Ajouter un dossier" et en sélectionnant les dossiers nécessaires, tels que ceux contenant des images, des fichiers CSS ou JavaScript, en fonction de la structure de votre projet.
Vous remarquerez que lorsque vous téléversez des dossiers, S3 extrait et structure automatiquement les fichiers par nom, type et taille. Cela peut parfois être déroutant pour les débutants, car les fichiers sont affichés dans un format structuré.
Une fois que vous avez téléversé vos fichiers et dossiers avec succès, faites défiler vers le bas et cliquez sur le bouton "Téléverser" pour terminer le processus.
Après avoir cliqué sur "Téléverser", AWS S3 commencera à téléverser vos fichiers. Vous verrez un indicateur de progression montrant l'état de chaque fichier en cours de téléversement en temps réel.
Une fois le téléversement terminé, vous verrez un message de confirmation indiquant "Téléversement réussi". AWS S3 générera alors une URL que vous pouvez trouver dans la section Résumé de la page des détails du bucket. (Voir l'image ci-dessous pour référence.)
Félicitations ! Vous avez téléversé votre projet dans AWS S3 avec succès. Maintenant, rendons cela accessible sur le web.
Cliquez sur le bouton "Fermer" pour quitter la page de téléversement. Maintenant, tout en restant dans votre bucket, configurons les paramètres et permissions nécessaires pour assurer un accès et un fonctionnement appropriés pour notre site web statique.
Comment définir les permissions et propriétés dans AWS S3
Après avoir téléversé vos fichiers, l'étape suivante consiste à configurer les permissions et propriétés pour vous assurer que votre site web statique fonctionne correctement.
Permissions : Par défaut, les objets S3 sont privés. Pour rendre votre site web accessible au public, vous devez ajuster la politique de bucket et les permissions des objets en conséquence.
Propriétés : Vous pouvez configurer divers paramètres tels que le versioning, le chiffrement et l'hébergement de site web statique sous l'onglet Propriétés de votre bucket, mais nous n'irons pas trop loin car nous ne faisons que passer par les bases.
Commençons par configurer les permissions :
Permissions
Par défaut, l'accès public est bloqué dans S3 pour des raisons de sécurité. Mais pour ce tutoriel, nous allons activer l'accès public pour nous assurer que notre site web statique est accessible aux utilisateurs.
Sur l'image ci-dessous, vous pouvez voir que l'accès public est bloqué par défaut :
Pour activer l'accès public, cliquez sur le bouton "Modifier" dans le coin supérieur droit. Ensuite, décochez l'option "Bloquer tout accès public". Après cela, cliquez sur "Enregistrer les modifications" pour appliquer la mise à jour.
Vous pouvez maintenant voir que l'accès public a été bloqué :
L'accès public est maintenant activé. Cliquez sur "Enregistrer les modifications" pour confirmer et appliquer la mise à jour.
Activation de l'accès public
AWS S3 vous demandera de saisir un texte de confirmation pour valider les paramètres. Saisissez le texte requis et confirmez, et l'accès public sera activé avec succès.
Maintenant que nous avons activé l'accès public, définissons une politique de bucket.
Qu'est-ce qu'une politique de bucket ?
Une politique de bucket est une politique de contrôle d'accès basée sur JSON qui définit les permissions pour votre bucket S3. Elle vous permet de spécifier qui peut accéder à votre bucket et quelles actions ils peuvent effectuer.
Avec une politique de bucket, vous pouvez :
Accorder ou restreindre l'accès public aux objets dans votre bucket.
Autoriser des utilisateurs ou services AWS spécifiques à interagir avec votre bucket.
Définir des permissions de lecture, d'écriture ou de suppression pour différents utilisateurs.
Dans cette prochaine section, nous allons configurer une politique de bucket pour rendre notre site web statique accessible au public.
Comment configurer une politique de bucket
La configuration d'une politique de bucket est simple. Cliquez sur le bouton "Modifier" dans la section Politique de bucket et collez la politique JSON suivante dans l'éditeur :
{
"Version": "2012-10-17",
"Statement": [
{
"Sid": "PublicReadGetObject",
"Effect": "Allow",
"Principal": "*",
"Action": "s3:GetObject",
"Resource": "arn:aws:s3:::nom-de-votre-bucket/*"
}
]
}
Comprendre les attributs de la politique :
Version : Définit la version du langage de la politique. La version
"2012-10-17"est la plus récente et la plus couramment utilisée pour les politiques S3.Statement : Une liste de règles qui définissent quelles actions sont autorisées ou refusées.
Sid (Statement ID) : Un identifiant unique pour l'instruction de la politique (facultatif mais utile pour référence).
Effect : Spécifie si la règle autorise ou refuse l'action spécifiée. Dans ce cas, c'est
"Allow".Principal : Définit qui a accès. Le
"*"signifie n'importe qui (accès public).Action : Spécifie l'opération autorisée.
"s3:GetObject"permet aux utilisateurs de récupérer (lire) des objets depuis le bucket.Resource : Définit le bucket spécifique et les objets auxquels la politique s'applique. Remplacez
"nom-de-votre-bucket"par le nom réel de votre bucket. Le"/*"signifie tous les objets dans le bucket.
Cette politique rend tous les objets du bucket lisibles publiquement, permettant aux utilisateurs d'accéder aux fichiers de votre site web statique via un navigateur.
Si vous avez suivi de près, votre page de politique de bucket devrait ressembler à ceci :
Maintenant, cliquez sur le bouton "Enregistrer les modifications", généralement situé en bas à droite de la page, pour appliquer vos modifications.
Après avoir suivi les étapes requises, la politique de bucket a été définie et l'accès public a été activé.
Félicitations ! Vous avez configuré avec succès votre politique de bucket et activé l'accès public, ce qui signifie que n'importe qui peut maintenant accéder à votre site web. Mais attendez, où est l'URL ?
Il reste une dernière étape : nous devons activer l'hébergement de site web statique. Pour ce faire, vous devrez naviguer vers l'onglet Propriétés et configurer l'hébergement de site web statique afin que votre site puisse être accessible sur le web. Je vais vous guider à travers le processus dans la section suivante.
Comment activer l'hébergement statique
Activer l'hébergement de site web statique est simple. Faites défiler jusqu'en bas de l'onglet Propriétés, et vous trouverez la section Hébergement de site web statique. Par défaut, cette option est désactivée. Activons-la pour rendre notre site web accessible sur le web.
Cliquez sur le bouton "Modifier" sur le côté droit de la section Hébergement de site web statique. Par défaut, cette option est désactivée, changez-la donc en Activé. Une fois activé, vous verrez plusieurs options de configuration, dont la plupart sont facultatives pour ce tutoriel.
Le paramètre le plus important ici est le Document d'index, qui spécifie le fichier par défaut qui se charge lorsqu'une personne accède à votre site. Le texte de l'espace réservé indique qu'il attend un fichier index.html. Tapez simplement index.html dans le champ Document d'index pour continuer.
Après avoir saisi index.html dans le champ Document d'index, faites défiler vers le bas et cliquez sur "Enregistrer les modifications" pour appliquer la configuration.
Après avoir appliqué les modifications avec succès, vous devriez trouver votre URL de site web statique en bas de la section Hébergement de site web statique dans l'onglet Propriétés de votre bucket.
Félicitations ! Vous venez d'héberger votre site web sur AWS S3. C'est une étape solide dans le monde de DevOps.
Votre URL devrait ressembler à ceci : http://nom-de-votre-bucket.s3-website.votre-région.amazonaws.com/.
Il vous suffit de copier et coller votre URL de site web statique dans votre navigateur pour voir votre site hébergé en direct.
Maintenant, vous avez les compétences pour héberger un site web statique pour un client et partager l'URL avec eux.
Alors, allez prendre un café et du pain aux bananes, vous l'avez mérité. Ensuite, nous passerons à la partie suivante du tutoriel.
Amazon CloudFront
Amazon CloudFront est un réseau de diffusion de contenu (CDN) rapide, hautement sécurisé et programmable qui améliore les performances et la sécurité des sites web.
Notre site web statique est hébergé sur S3(http://nom-de-votre-bucket.s3-website.votre-région.amazonaws.com/) – mais vous pourriez remarquer que le site est accessible via HTTP mais manque de mesures de sécurité appropriées telles que le chiffrement SSL/TLS. CloudFront répond à ces limitations en fournissant un moyen sécurisé et évolutif de servir à la fois du contenu statique et dynamique à l'échelle mondiale.
Il livre le contenu aux utilisateurs avec une faible latence en mettant en cache des copies de votre site web dans des emplacements de périphérie à travers le monde. Lorsqu'un utilisateur demande une ressource, CloudFront la sert depuis l'emplacement de périphérie le plus proche, améliorant ainsi considérablement la vitesse et la disponibilité.
Fonctionnalités clés d'Amazon CloudFront
Livraison de contenu sécurisée : CloudFront prend en charge le chiffrement SSL/TLS, garantissant que les données sont transférées de manière sécurisée entre les clients et les serveurs.
Protection contre les attaques DDoS : Intégré avec AWS Shield, CloudFront aide à atténuer les attaques par déni de service distribué (DDoS).
Mise en cache de contenu mondiale : CloudFront met en cache le contenu dans plusieurs emplacements de périphérie, réduisant la charge du serveur et la latence.
Distribution personnalisable : Les utilisateurs peuvent configurer le comportement du cache, les paramètres d'origine et les politiques de sécurité.
Intégration transparente avec les outils AWS : CloudFront s'intègre avec AWS Lambda@Edge, S3, EC2 et API Gateway, prenant en charge la diffusion de contenu statique et dynamique.
Optimisation des coûts : Réduit les coûts de transfert de données en mettant en cache et en servant le contenu depuis les emplacements de périphérie au lieu de directement depuis l'origine.
Pourquoi Amazon S3 seul ne suffit pas
Amazon S3 est un service de stockage d'objets évolutif et durable, mais il manque de fonctionnalités clés nécessaires pour servir du contenu web de manière sécurisée.
Tout d'abord, il n'a pas HTTPS par défaut. Lorsqu'un site est hébergé sur S3, il n'est accessible qu'en HTTP sauf si des configurations supplémentaires sont effectuées.
Deuxièmement, il a une latence plus élevée. Les buckets S3 sont hébergés dans une région AWS spécifique, ce qui peut entraîner une livraison de contenu plus lente pour les utilisateurs dans différentes régions.
Il n'a pas non plus de mise en cache intégrée, ce qui signifie que chaque demande est servie depuis S3, augmentant le temps de réponse et les coûts potentiels.
Et enfin, il n'y a pas de protection contre les attaques DDoS – contrairement à CloudFront, S3 ne fournit pas de protection native contre les cyberattaques.
Pourquoi vous devriez servir votre site web avec CloudFront
Bien qu'Amazon S3 soit une excellente solution de stockage, il manque des optimisations de sécurité et de performance nécessaires pour l'hébergement web. Amazon CloudFront améliore la sécurité avec le chiffrement SSL/TLS, améliore les performances avec la mise en cache mondiale et fournit des fonctionnalités de sécurité robustes comme la protection contre les attaques DDoS.
En tirant parti de CloudFront, vous pouvez vous assurer que votre site web est non seulement rapide mais aussi sécurisé, évolutif et rentable.
Pour commencer à héberger votre site sur CloudFront, accédez à la page du service CloudFront dans AWS. Vous pouvez le faire en allant sur la page d'accueil ou le tableau de bord de la console de gestion AWS et en recherchant "CloudFront" à l'aide de la barre de recherche en haut à gauche. Cliquez sur "CloudFront" dans les résultats de recherche pour continuer.
Une fois que vous avez accédé à la page AWS CloudFront, vous verrez un bouton Créer une distribution. Cliquez dessus pour commencer à configurer CloudFront pour votre site web.
Qu'est-ce qu'une distribution CloudFront ?
Une distribution CloudFront est la configuration qui définit comment CloudFront livre le contenu aux utilisateurs. Elle agit comme un lien entre votre serveur d'origine (tel qu'un bucket S3) et le réseau mondial d'emplacements de périphérie de CloudFront. Lorsqu'un utilisateur demande votre site, CloudFront récupère le contenu depuis l'emplacement de périphérie le plus proche au lieu de toujours le récupérer depuis l'origine, garantissant ainsi des temps de chargement plus rapides, une latence réduite et une sécurité améliorée.
Il existe deux types de distributions dans CloudFront :
Distribution Web : Utilisée pour les sites web, les API et le contenu dynamique ou statique.
Distribution RTMP (Dépréciée) : Auparavant utilisée pour le streaming multimédia (maintenant remplacée par des services de streaming modernes).
Pour notre site web hébergé sur S3, nous allons créer une Distribution Web pour servir le contenu de manière sécurisée via HTTPS tout en améliorant la vitesse et la fiabilité.
Après avoir cliqué sur le bouton Créer une distribution, vous serez redirigé vers la page Créer une distribution, où vous pouvez configurer divers paramètres. Dans ce tutoriel, nous nous concentrerons sur les options essentielles.
Dans la section Origine, sélectionnez votre bucket S3 comme domaine d'origine.
Si votre bucket S3 a l'hébergement de site web statique activé, AWS recommande d'utiliser le point de terminaison du site web S3 au lieu du point de terminaison du bucket par défaut.
Entrez le bon point de terminaison du site web S3 dans le champ Domaine d'origine. Par exemple :
freecodecampbuckettutorial.s3-website.ca-central-1.amazonaws.com
- Assurez-vous d'utiliser le point de terminaison du site web S3 plutôt que l'URL standard du bucket S3 pour éviter les problèmes d'accès à votre site.
En suivant ces étapes, vous garantissez que CloudFront sert correctement votre site web statique depuis le bucket S3.
Assurez-vous d'utiliser le point de terminaison du site web S3 plutôt que l'URL standard du bucket S3 pour éviter les problèmes d'accès à votre site. Cela vous sera suggéré de manière descriptive lors de la saisie du nom d'origine. Cliquez sur "Utiliser le point de terminaison du site web" et il remplira le champ avec le point de terminaison du site web du bucket S3 au lieu de l'URL du bucket.
Ensuite, faites défiler jusqu'à la section Pare-feu d'application Web (WAF) en bas de la page et activez les protections de sécurité pour protéger votre site web contre les menaces web courantes. Sélectionnez "Créer une distribution" pour déployer votre distribution CloudFront.
Votre page Distributions CloudFront devrait maintenant afficher la nouvelle distribution créée. La page inclura des détails clés tels que :
ID de distribution : Un identifiant unique pour votre distribution CloudFront.
Nom de domaine : L'URL fournie par CloudFront (par exemple,
d1234abcd.cloudfront.net), que vous pouvez utiliser pour accéder à votre site.
Après avoir créé votre distribution CloudFront, accédez à votre page Distributions et vérifiez la section Dernière modification pour son statut. Si le statut indique Déploiement en cours, vous devrez attendre qu'il change, ce qui peut prendre plusieurs minutes.
Une fois le déploiement terminé, le statut se mettra généralement à jour avec un horodatage, indiquant que la distribution est prête à être utilisée. Assurez-vous que le statut a changé avant de procéder à d'autres configurations ou d'accéder à votre distribution CloudFront.
Votre site web est maintenant hébergé avec succès sur CloudFront !
Nous avons maintenant notre nom de domaine CloudFront (par exemple, d1234abcd.cloudfront.net), que vous pouvez trouver dans la section Détails de votre distribution. Avant d'apporter d'autres modifications, prévisualisons le site en copiant et collant le nom de domaine dans un navigateur web.
À ce stade, lorsque vous essayez d'accéder à votre site web en utilisant le nom de domaine CloudFront, vous remarquerez que le site est inaccessible. Cela se produit parce que CloudFront n'a pas encore la permission de récupérer le contenu de votre bucket S3.
Pour résoudre ce problème, vous devez mettre à jour votre politique de bucket S3 pour autoriser explicitement CloudFront à accéder à vos objets. Vous pouvez le faire en ajoutant une condition qui accorde l'accès aux requêtes provenant spécifiquement de votre distribution CloudFront.
Comprendre le nom de ressource Amazon (ARN)
Un nom de ressource Amazon (ARN) est un identifiant unique attribué aux ressources AWS. Chaque distribution CloudFront a son propre ARN, que vous pouvez trouver en haut de la page des détails de la distribution CloudFront. Il ressemble à quelque chose comme ceci :
arn:aws:cloudfront::123456789012:distribution/E2ABC3XYZ456
Cet ARN est crucial car nous l'utilisons dans notre politique de bucket pour restreindre l'accès uniquement à notre distribution CloudFront, garantissant ainsi qu'aucun autre service ou utilisateur ne peut récupérer des données directement depuis notre bucket S3.
Politique de bucket S3 mise à jour
Pour permettre à CloudFront de servir du contenu depuis notre bucket S3, nous mettons à jour la politique de bucket S3 comme suit :
{
"Version": "2012-10-17",
"Statement": [
{
"Effect": "Allow",
"Principal": {
"Service": "cloudfront.amazonaws.com"
},
"Action": "s3:GetObject",
"Resource": "arn:aws:s3:::nom-de-votre-bucket/*",
"Condition": {
"StringEquals": {
"AWS:SourceArn": "arn:aws:cloudfront::[ID_DE_COMPTE]:distribution/[ID_DE_DISTRIBUTION]"
}
}
},
{
"Effect": "Allow",
"Principal": "*",
"Action": "s3:GetObject",
"Resource": "arn:aws:s3:::nom-de-votre-bucket/*"
}
]
}
Décomposons la politique de bucket :
Première instruction qui accorde l'accès à CloudFront :
"Effect" : "Allow": Cela permet l'accès à la ressource spécifiée."Principal" : { "Service" : "cloudfront.amazonaws.com" }: Accorde l'accès spécifiquement à CloudFront."Action" : "s3:GetObject": Permet à CloudFront de récupérer des objets depuis le bucket S3."Resource" : "arn:aws:s3:::nom-de-votre-bucket/*": Accorde l'accès à tous les objets dans le bucket S3."Condition": Garantit que seules les requêtes provenant de notre distribution CloudFront sont autorisées en utilisant :
"AWS:SourceArn" : "arn:aws:cloudfront::123456789012:distribution/E2ABC3XYZ456"
Deuxième instruction (facultative, et accorde l'accès public)
Cette instruction permet à tous les utilisateurs (
Principal : "*") d'accéder aux objets S3.Si vous souhaitez restreindre l'accès uniquement à CloudFront, vous pouvez supprimer cette deuxième instruction.
Après avoir modifié et mis à jour votre politique de bucket S3 pour permettre l'accès à CloudFront, vous pouvez actualiser la page où vous prévisualisez votre nom de domaine CloudFront (par exemple, d1234abcd.cloudfront.net). Ouvrez-le dans un navigateur, et si vous avez suivi toutes les instructions avec soin, vous avez hébergé avec succès un site statique sur S3 et CloudFront.
Votre site web est maintenant entièrement protégé, bien joué ! Félicitations, pro de DevOps !
COUP DE POING !
Conclusion
Dans ce guide, nous n'avons fait qu'effleurer la surface de ce qu'AWS peut faire. S3 et CloudFront sont des services puissants, mais il y a encore tellement plus à explorer, des paramètres de sécurité avancés à l'automatisation et aux optimisations de performance.
Alors que vous continuez votre parcours AWS, vous pouvez approfondir des sujets comme les stratégies de mise en cache, les configurations de domaine personnalisé et l'intégration d'AWS Lambda@Edge pour du contenu dynamique. Les possibilités sont infinies.
Ce n'est que le début, et vous êtes bien parti. Continuez à expérimenter, continuez à apprendre, et bientôt nous maîtriserons des capacités AWS encore plus avancées. Bonne construction ! 🚀