Dans ce tutoriel, nous allons vous expliquer comment compléter une intégration WordPress Amazon S3 ainsi que l’utilisation optionnelle d’un réseau de diffusion de contenu (CDN). Cela peut vous permettre d’économiser considérablement sur les coûts de bande passante, de faire office de sauvegarde et d’accélérer votre site.

Amazon S3 est une solution de stockage, et fait partie des nombreux produits d’Amazon Web Services. Elle est généralement utilisée pour les sites qui soit ont besoin de sauvegardes supplémentaires avec une solution comme notre module de sauvegardes externes, ou servent des fichiers volumineux (téléchargements, logiciels, vidéos, jeux, fichiers audio, PDF, etc.)

Amazon a fait ses preuves en matière de fiabilité et, grâce à son infrastructure massive, elle est en mesure d’offrir des coûts de stockage très bas. S3 compte parmi ses clients Netflix, Airbnb, SmugMug, Nasdaq, etc.

WordPress Amazon S3

Étant donné qu’Amazon S3 s’occupe entièrement du stockage en masse, vous pouvez presque garantir que les prix seront moins chers que votre hébergeur WordPress. Le transfert de supports vers AWS peut être un excellent moyen d’économiser de l’argent et est gratuit pour votre première année (jusqu’à 5 Go de stockage). De plus, comme les requêtes pour vos médias sont servies directement depuis Amazon, cela réduit la charge sur votre site WordPress, ce qui signifie des temps de chargement plus rapides.

Amazon S3 ne doit pas être confondu avec Amazon CloudFront. CloudFront est une solution CDN, tandis que S3 est une solution de stockage. Cependant, ils peuvent tous deux être utilisés de façon interchangeable, comme nous le verrons plus loin.

Configuration de Amazon S3 sur WordPress

Pour cette intégration, nous recommandons d’utiliser le plugin WP Offload S3 Lite, développé par l’équipe de Delicious Brains. La version de base est gratuite. Le plugin copie automatiquement les fichiers de votre site WordPress vers Amazon S3 au fur et à mesure qu’ils sont téléchargés dans la médiathèque. Il existe ensuite une configuration optionnelle pour ajouter un CDN, comme Amazon CloudFront, KeyCDN ou MaxCDN.

WP Offload S3 Lite
WP Offload S3 Lite

Ce plugin est assez léger, seulement 204 Ko pour être exact. Au moment d’écrire ces lignes, il y a actuellement plus de 30 000 installations actives avec une note de 4 étoiles sur 5. Suivez les étapes ci-dessous.

Étape 1

Ensuite, installez le plugin gratuit WP Offload S3 Lite. Vous pouvez le télécharger à partir du dépôt WordPress ou en recherchant « wp offload s3 » dans votre tableau de bord WordPress sous « Ajouter » extensions. Cliquez sur « Installer maintenant » et activez-le.

Installer WP Offload S3 Lite
Installer WP Offload S3 Lite

Étape 2

Vous pouvez suivre la documentation WordPress pour Amazon S3 de Delicious Brains ou nous vous guiderons à travers le reste en profondeur.  Connectez-vous à votre compte Amazon Web Services. Si vous n’en avez pas, vous pouvez vous inscrire gratuitement. Vous devrez ensuite créer un nouvel utilisateur. Choisissez un nom d’utilisateur et assurez-vous de sélectionner « Programmatic Access ».

Amazon Web Services - Ajouter un utilisateur
Amazon Web Services – Ajouter un utilisateur

Étape 3

Maintenant vous devez configurer les permissions pour que l’utilisateur puisse gérer les fichiers dans S3, alors sélectionnez « Attacher directement les stratégies existantes » et cliquez sur « Créer une stratégie ». Une nouvelle fenêtre s’ouvrira. Une fois que vous aurez terminé, vous devrez y revenir.

Permissions dans la PIC
Permissions dans la PIC

Étape 4

Cliquez sur « Sélectionner » à côté de l’option Créer votre propre politique.

Créer une politique dans la AWS
Créer une politique dans la AWS

Étape 5

Ensuite, vous devrez donner un nom et une description à votre politique. Ça peut être ce que vous voulez. Copiez ensuite le code suivant dans la section « Document de politique ».

{
  "Version": "2012-10-17",
  "Statement": [
    {
      "Effect": "Allow",
      "Action": [
        "s3:CreateBucket",
        "s3:DeleteObject",
        "s3:Put*",
        "s3:Get*",
        "s3:List*"
      ],
      "Resource": [
        "arn:aws:s3:::*"
      ]
    }
  ]
}

Cette politique permet à l’utilisateur de créer des buckets, de supprimer des fichiers uniquement (et non des buckets), d’envoyer des fichiers, de télécharger des fichiers et de lister des fichiers et des buckets. C’est le niveau de permissions de base dont les plugins ont besoin pour fonctionner.

Cependant, nous vous recommandons de consulter la documentation de Delicious Brain sur les restrictions supplémentaires concernant les buckets. Par exemple, en modifiant la section des ressources ci-dessus et en ajoutant le nom de votre bucket pour le verrouiller (perftesting est le nom de notre buck plus bas à l’étape 11).

"Resource": [
 "arn:aws:s3:::perftesting/*",
]

 Cliquez ensuite sur « Créer une politique ».

Révision de la politique AWS
Révision de la politique AWS

Étape 6

Pour revenir à la fenêtre de l’étape 4, vous devez maintenant ajouter la politique à l’utilisateur que vous créez. Cliquez sur « Rafraîchir » et vous devriez voir votre nouvelle politique que vous venez de créer en haut de la page. Sélectionnez-la et cliquez sur « Suivant ».

Autorisations AWS pour l'utilisateur
Autorisations AWS pour l’utilisateur

Étape 7

Cliquez ensuite sur « Créer un utilisateur ».

AWS créer utilisateur
AWS créer utilisateur

Étape 8

Sur le dernier écran, vous devrez copier votre ID de clé d’accès et votre clé d’accès secrète dans un endroit sûr car vous en aurez besoin pour revenir dans votre tableau de bord WordPress.

Accès AWS
Accès AWS

Étape 9

De retour dans WordPress, cliquez sur « Access Keys » sous AWS et entrez vos identifiants que vous venez de créer. Ou, comme Delicious Brains le recommande, il est préférable de les définir dans votre fichier wp-config.php. Copiez simplement l’extrait suivant et remplacez les étoiles par les accès.

define( 'DBI_AWS_ACCESS_KEY_ID', '********************' );
define( 'DBI_AWS_SECRET_ACCESS_KEY', '****************************************' );
Branchement des services Web Amazon dans WordPress
Branchement des services Web Amazon dans WordPress

Étape 10

Vous devez ensuite créer un bucket à utiliser. Si vous n’êtes pas encore inscrit sur Amazon S3, vous pouvez le faire ici. Ils ont un essai gratuit avec lequel vous pouvez commencer. Cliquez sur « S3 et CloudFront » sous les paramètres du plugin AWS et cliquez sur « Create bucket ». Vous pouvez ensuite choisir une région. Cliquez sur « Create New Bucket ». N’oubliez pas que les coûts de stockage varient d’une région à l’autre. Voici les prix.

Créer un bucket Amazon S3
Créer un bucket Amazon S3

Step 11

Pour que WP Offload S3 fonctionne avec certains plugins tiers tels que WooCommerce, vous devrez peut-être installer et activer certains de leurs plugins additionnels de compatibilité. Et cela nécessite parfois de payer pour leur licence premium. Cependant, bien souvent vous pouvez vous débrouiller avec la version gratuit. Par défaut, les options suivantes sont cochées. Si vous utilisez HTTPS, vous voudrez l’activer.

Paramètres du plugin AWS
Paramètres du plugin AWS

Votre installation WordPress Amazon S3 est maintenant terminée ! Vos images seront maintenant copiées sur le stockage Amazon S3 lorsqu’elles seront téléchargées dans votre médiathèque WordPress. Vous pouvez aussi faire la même technique avec vos ressources (CSS, JS, polices, etc), mais il faut une licence premium pour obtenir l’addon assets pull.

Note : Les fichiers téléchargés manuellement via SFTP ne seront pas copiés sur Amazon S3. WP Offload Media ne décharge que les éléments qui ont d’abord été téléchargés dans votre médiathèque WordPress.

Un autre paramètre important ci-dessus est l’option de supprimer les fichiers du serveur local une fois qu’ils ont été déchargés sur S3. Cela peut aider à réduire considérablement l’espace disque nécessaire avec votre hébergeur WordPress. Assurez-vous simplement de vérifier la compatibilité avec d’autres plugins si vous l’activez. Vous pouvez également consulter ce tutoriel sur le téléchargement de fichiers sur Amazon S3 à partir du navigateur.

Amazon S3 et CDN pour WordPress

Si vous utilisez un CDN pour accélérer la livraison de vos ressources, vous pouvez l’activer dans la section CloudFront ou Domaine personnalisé. Jetez un coup d’œil aux tutoriels suivants pour vous aider à faire cela.

Une fois que vous l’avez configuré et que vous avez votre URL CDN, vous pouvez l’entrer dans le champ domaine personnalisé comme indiqué ci-dessous.

CDN Amazon S3
CDN Amazon S3

N’oubliez pas de consulter également notre guide sur la façon de décharger des médias vers Google Cloud Storage.