Ajouter AWS CloudFront devant S3 et analyser votre trafic avec GoAccess (partie 1)

Cette architecture est fantastique à bien des égards, ceci dit, elle comporte deux limitations qui sont devenues problématiques dans mon cas précis:

1. L’information générée par les logs de S3 est plutôt limitée pour en faire une analyse approfondie. Par exemple, le header X-Forwarded-For est ignoré cachant la vraie adresse IP des utilisateurs lorsque derrière un proxy comme CloudFlare.
2. Le modèle financier basé sur le nombre de requêtes S3 n’est pas toujours avantageux dépendamment de l’efficacité du caching de CloudFlare. Pour ma part, j'ai deux sites Web, dont un qui reçoit un nombre anormalement élevé de requêtes même avec CloudFlare.

Une architecture un peu plus complète

Pour pallier à ces limitations, une solution facile peut être ajoutée à la pile de technologies déjà utilisées, c’est-à-dire AWS CloudFront.

En somme, CloudFront est un Content Delivery Network permettant aux gens voulant se connecter à votre site de le faire d'un serveur plus près d'eux et souvent plus rapidement grâce à un système de mémorisation des fichiers provenant de l'origine (s3 bucket dans notre cas) sur chacun des leurs serveurs autour de la planète.

Les couts associés sont basés d'abord sur le bandwidth utilisé et ensuite par tranche de très grand nombre de requêtes HTTP sans discrimination par méthode.

Ajout de CloudFront

Nous allons passer de ceci:               À cela:

+-----------------------------+           +-----------------------------+
|          Interwebz          |           |          Interwebz          |
+--------------+--------------+           +--------------+--------------+
               |                                         |
+--------------v--------------+           +--------------v--------------+
|  Cloudflare DNS+Proxy+CDN   |           |  Cloudflare DNS+Proxy+CDN   |
+--------------+--------------+           +--------------+--------------+
               |                                         |
+--------------v--------------+           ###############v###############
|   AWS S3 Website endpoint   |           ####### AWS Cloud Front #######
+--------------+--------------+           ###############+###############
               |                                         |
+--------------v--------------+           +--------------v--------------+
|        AWS S3 Bucket        |           |   AWS S3 Website endpoint   |
+-----------------------------+           +--------------+--------------+
                                                         |
                                          +--------------v--------------+
                                          |        AWS S3 Bucket        |
                                          +-----------------------------+

Comment configurer CloudFront avec un bucket S3 en utilisant la console AWS

Voici étape par étape comment créer une distribution CoudFront (CDN property en anglais)

1. Cliquez sur CloudFront et sur Create Distribution

2. Dans la section Web, cliquez sur Get Started

3. Comme Origin Domain Name, n’utilisez pas le menu offert. À la place, copier-coller le domaine complet de votre bucket S3 aussi appelé Endpoint.

   Vous le trouverez dans la section Static Website Hosting de votre bucket. Le but ici est de continuer d’utiliser S3 pour l’hébergement des fichiers statiques sans changer les configurations avec les documents index et erreur par défaut. De cette façon, tous vos URLs pointant directement sur des dossiers (communément appellé pretty URLs) vont continuer de fonctionner correctement.

4. Changez les options dans la section Object Caching manuellement afin de contrôler vos couts le mieux possible par rapport au trafic anticipé.

   Plus longtemps le TTL (time to live) est, le moins souvent CloudFront va avoir à télécharger les fichiers de votre bucket S3. Pour un site Web statique, ne vous gênez pas d’exagérer un peu.

5. Choisissez Only US and Europe pour sauver des couts si vous êtes comme moi du Canada et ne vous souciez pas trop de l’Asie.

6. N’oubliez pas d’ajouter votre nomdedomaine.com et www.votrenomdedomaine.com au CNAMEs .sinon AWS ne saura pas comment lier votre domaine à votre entité .

7. Laissez tout le reste par défaut et cliquez sur Create Distribution.

8. Attendez que votre distribution ait un statut Deployed, ça peut prendre un bon bout de temps.

Rediriger le trafic vers CloudFront au lieu de S3 Web Hosting

Tout est fait pour AWS, alors maintenant il faut changer les configurations de CloudFlare pour faire pointer les domaines sur CloudFront au lieu de S3:

1. Authentifiez-vous chez CloudFlare et cliquez sur votre domaine et sur DNS
2. Changez vos DNS records pour obtenir deux CNAME (alias), un avec le www et l’autre sans, pointant vers votre domaine CloudFront qui ressemble à quelque chose comme pleindecaracteres.cloudfront.net. Vous trouverez ce dernier dans votre liste de distributions CloudFront.
3. Vous pouvez laisser le status à DNS and http Proxy (CDN) pour le moment. On changera ça plus tard.

Ça devrait ressembler à ceci visuellement:

Soyez gentil avec Google et aidez votre SEO

Une chose à ne pas oublier si vous avez suivi le tutoriel de Claudine est de s'assurer que votre www.nomdedomaine.com continue de rediriger sur votrenomdedomain.com car après avoir suivi ces étapes ci-haut mentionnées, nous avons malheureusement brisé cette redirection. La raison est que CloudFlare pointe désormais toutes les requêtes sur notre top level bucket.

Pour corriger, dans CloufFlare, ajoutez simplement un "rule" de type Forwarding URL (301) redirigeant https://www.votrenomdedomaine.com/* vers https://votrenomdedomaine.com/.

Oh! Tous mes exemples utilisent HTTPS car j'ai activé le SSL en mode Flexible. Vous devriez faire de même; Google est en amour avec SSL et vous donnera des points bonis.

Prochaines étapes

Vous avez maintenant un site Web qui passe par CloudFront. Par conséquent, les couts seront calculés avantageusement pour les sites avec un trafic plus élevé en théorie. CloudFlare n'est pas l'option la moins dispendieuse sur le marché si vous êtes un gros joueur, mais pour un site Web avec un peu de trafic, c'est merveilleux.

En deuxième partie, nous allons configurer les logs et analyser notre fameux trafic avec GoAccess.