Introduction à WordPress sous Nginx

J’ai commencé à utiliser Nginx il y a plusieurs années. Comme plusieurs, j’utilisais Apache qui était la solution la plus populaire. Un jour, alors que nos visites quotidiennes ont dépassé les centaines des requêtes en même temps, les problèmes ont fait leur apparition. Apache crashait constamment.

Ajouter du matériel plus performant n’était pas une option à cause de coûts. C’est à ce moment que j’ai découvert Nginx!

WordCamp Montréal

Le contenu qui suit a été présenté au WordCamp de Montréal. Le WordCamp est une conférence dédiée à WordPress. Étant un grand fan de WordPress et également de Nginx, l’occasion était parfaite de réunir les deux sujets.

Toutefois, en faisant ma présentation, je me suis rendu compte qu’il y avait beaucoup d’aspects théoriques nécessitant du code. Montrer du code dans une présentation n’est pas l’idéal, mais c’était nécessaire dans ce cas. Puis, je me suis rendu compte que je n’aurais pas le temps de tout couvrir. Un article sur mon blogue devenait nécessaire.

Voici donc la présentation telle que présentée au WordCamp :

La mission

Je reprendrai donc ici les étapes vous permettant d’installer WordPress sous un serveur Nginx que vous aurez vous-même installé! Notez que j’utiliserai Ubuntu 14.04 pour y parvenir via les services de Digital Ocean.  Si vous souhaitez en apprendre davantage sur les différences entre Apache et Nginx, je vous recommande de lire: Apache vs Nginx.

Bien qu’il aurait été possible de tout compiler soi-même le code source, j’utiliserai Apt-Get. Par le passé, j’avais choisi de tout compiler manuellement, mais cela demande énormément de temps (d’attente et de débogage pour les librairies incompatibles entre elles). Si vous n’avez aucune expérience, donnez-vous une chance!

Pour réussir notre mission, nous devrons :

 

Préparation à l’installation

Tout d’abord, vous devrez rediriger un nom de domaine (ou sous-domaine) vers l’adresse IP du serveur web. Dans le cas présent, nous considèrerons que monsite.com a été acheté et redirigé vers l’adresse IP du serveur : 66.77.88.99.

Avant d’installer quoi que ce soit sur votre serveur web, il est recommandé de le mettre à jour. Nous exécuterons un update (mise à jour de la liste des packages) et un upgrade (mise à jour des packages installés).

Ça y est, on est prêt à débuter!

 

Installation de Nginx

L’installation de Nginx est plutôt simple et consiste en une seule commande :

Ensuite, on démarre Nginx :

C’est tout! Vous pouvez maintenant tester votre installation via l’adresse IP du serveur : http://66.77.88.99.

Si l’installation a fonctionné, vous verrez ceci :

Bienvenue sur Nginx

Par défaut, les fichiers que doit servir Nginx se trouvent dans : /usr/share/nginx/html

Vous auriez pu trouver cette information dans le fichier de configuration de base: /etc/nginx/sites-available/default

Vous y trouverez le fichier index.html ainsi que les images qui affichent la page. Vous pouvez aller faire une modification dans le fichier index.html pour confirmer que c’est le bon fichier.

Tadam!

Bienvenue dans Nginx (modifié)

Il y a quelques notions théoriques à comprendre pour utiliser Nginx efficacement. Les voici :

 

Quand vous faites une modification à la configuration de Nginx, seul un « reload » est nécessaire. Contrairement à Apache qui vérifie chaque fois le contenu du fichier .htaccess, Nginx lit la configuration uniquement au démarrage et lors d’un « reload ». Cela aide à accélérer la vitesse d’affichage puisque la lecture d’un fichier est un processus lent (contrairement à l’utilisation d’information en mémoire).

Maintenant, il faut savoir où peut-on modifier les fichiers de configuration pour Nginx. Ils se trouvent dans : /etc/nginx

Dans un premier temps, il y a le fichier de configuration principal du serveur soit nginx.conf que j’ai modifié pour qu’il contienne ceci:

On modifie généralement ce fichier tout de suite après l’installation et on y touche rarement par la suite.

Vous pouvez consulter la documentation sur la configuration de Nginx pour en apprendre davantage.

Puis, il y a deux répertoires à retenir :

  • /etc/nginx/sites-available ← sites disponibles
  • /etc/nginx/sites-enabled ← sites activés

De manière générale, on crée la configuration d’un site dans le répertoire des sites disponibles et on ajoute un lien symbolique dans le répertoire des sites activés. Ainsi, si on doit désactiver le site, on peut supprimer uniquement le lien symbolique et garder la configuration! C’est ce que nous ferons.

Donc dans /etc/nginx/sites-available, nous créerons le fichier monsite.com. Nous insérerons le code suivant :

 

À noter : plusieurs scripts trouvés sur internet contiennent des « if ». Je vous invite à lire l’article ifs are evil trouvé dans la documentation de Nginx.

Puis, on ajoute un lien symbolique pour l’ajouter dans les sites activés :

 

Création du site

Puis, nous devrons créer le répertoire pour accueillir le contenu du site. Personnellement, j’aime bien créer un utilisateur pour chaque site et mettre le code dans le dossier home de cet utilisateur. Cela assure une indépendance au niveau des utilisateurs.

 

Attention : WordPress insiste pour utiliser le même nom d’utilisateur qu’à l’installation pour la propriété des fichiers. Il est donc une bonne idée d’avoir un utilisateur par compte pour éviter à WordPress de devoir se connecter via FTP pour simuler adéquatement les droits de fichiers. Vous pouvez lire l’article sur les permissions pour les sites avec WordPress.

On peut maintenant tester notre site. Il faut tout d’abord recharger la configuration :

 

Puis, allez voir le site : http://www.monsite.com

MonSite.com - HTML

Ça fonctionne!

 

Installation de PHP, PHP-FPM et MySQL

Qui dit WordPress dit également PHP (minimum 5.2.4) et MySQL (minimum 5.0). L’installation est assez simple et se résume ainsi pour MySQL:

(Pendant l’installation, on vous demandera de choisir un mot de passe administrateur pour MySQL.)

Et pour PHP et PHP-FPM, j’y vais assez simplement (même si de nombreux autres packages pourraient être ajoutés):

 

Configuration de PHP

Plusieurs optimisations peuvent être faites à ce stade, mais nous nous contenterons de faire le minimum dans notre php.ini qui se trouve dans : /etc/php5/fpm/php.ini

 

Le premier changement est pour une question de sécurité. Les deux suivants sont pour vous permettre d’envoyer vos extensions et thèmes sans être trop restreints au niveau de la taille du fichier qui peut être envoyé.

Pour optimiser l’exécution du PHP, il est fortement conseillé d’activer OPcache afin de pouvoir garder en mémoire le code pré-compilé.  Voyez une réponse complète sur StackOverflow.

 

Création d’une base de données MySQL

Nous ne ferons aucune optimisation pour MySQL dans le cadre de cet article, mais vous devriez valider ce qui peut être fait pour améliorer les performances. Voici comment créer un utilisateur et une base de données pour notre accueillir notre site :

 

Ensuite, on teste notre utilisateur

 

Si vous entrez le bon mot de passe, ça fonctionne!

 

Configuration de PHP-FPM

Présentement, notre installation de Nginx prend les fichiers tels qu’ils sont sur le serveur et les retourne. C’est bien sauf dans le cas des fichiers PHP qui doivent être exécutés. Nginx devra donc intercepter les fichiers avec l’extension PHP pour qu’ils soient exécutés.

La configuration de PHP-FPM se trouve dans le répertoire : /etc/php5/fpm/

La gestion de PHP-FPM se fait via un « pool » de connexions. Il est possible d’utiliser un seul pool par serveur ou un pool par site. Pour WordPress, tel que mentionné plus haut pour la gestion des droits de fichiers, il est préférable d’avoir un pool par site. Ainsi, nous créerons un nouveau fichier nommé monsite.conf dans le répertoire /etc/php5/fpm/pool.d/ et contenant le code suivant :

Remarquez les lignes surlignées où l’information varie d’un site à l’autre.

La configuration est complétée pour notre nouveau site. Le service doit être redémarré!

 

Test d’un fichier php

Allons maintenant modifier notre fichier de configuration de Nginx pour monsite.com ajouter un fichier php dans le compte de notre nouvel utilisateur.

Modifions tout d’abord notre fichier de configuration :

Remarquez les lignes surlignées qui ont été ajoutées.

Maintenant, nous créerons un fichier PHP afin de s’assurer que la gestion fonctionne.

 

Il ne reste qu’à redémarrer Nginx pour prendre tous les changements en considération :

 

Allons voir le résultat : http://www.monsite.com/pi.php

Vous devriez avoir un résultat similaire à ceci :

monsite-dyn

Et si on redémarrait

Maintenant, testons un redémarrage du système pour voir si on pourra accéder au site par la suite. Il faut s’assurer que tous les services sont fonctionnels.

Attendez 2 minutes et visitez : http://www.monsite.com/pi.php

Le site est fonctionnel… ouf!

 

Configuration pour WordPress

Maintenant, il faut ajuster notre configuration pour WordPress, il existe de nombreuses façons d’y parvenir, mais la méthode qui fonctionne le mieux pour moi est de créer des fichiers standardisés que j’inclus dans ma configuration si le site utilise WordPress.

Je débute par créer un répertoire « wordpress » dans le répertoire de Nginx :

 

À l’intérieur de /etc/nginx/wordpress, je crée les fichiers suivants :
wp-global.conf

 

wp-restriction.conf

 

multisite.conf

 

Puis, je fais tout simplement le lien dans le fichier de configuration de mon site avec les nouveaux fichiers créés. Ainsi, je n’ai pas à tout retranscrire à chaque fois.

Mon fichier de configuration ressemble maintenant à ceci :

Remarquez les lignes surlignées qui ont été ajoutées!

Il ne reste qu’à recharger la configuration :

La configuration est officiellement complétée!

 

Installation de WordPress

Nous sommes maintenant rendus au bout que vous connaissez tous! L’installation ne prendra que quelques minutes. On commence par récupérer le code :

 

Puis, on visite le site et on suit les étapes pour compléter l’installation : http://www.monsite.com

Voilà! Vous avez maintenant un site web WordPress géré avec Nginx.

À propos de l'auteur

Maxime Jobin

Maxime Jobin est un entrepreneur, un programmeur, un stratège technologique, un chargé de cours et un passionné de WordPress. Il aime partager ses connaissances et permettre aux entreprises de devenir plus productives et réduire leurs coûts d'exploitation grâce aux technologies.

29 commentaires

  • Super article Maxime! J’ajouterais ceci à ton fichier de configuration serveur pour changer les header des fichiers statiques.


    location ~* .(jpg|jpeg|png|gif|ico|css|js)$ {
    expires 365d;
    }

    • En fait, si tu regardes la ligne #13 de wp-global.conf, tu verras que la commandes expires max; s’y trouve. J’aurais peut-être dû mettre une commande pour ligne pour en simplifier la lecture.

  • Salut,

    Je considère migrer quelques site sur un hébergement type cloud. Comme tu utilises Digital Ocean, est-ce que tu es satisfait de leur service (disponibilité de réseau, etc.)?

    Merci

    • Je recommande Digital Ocean puisqu’ils sont, VPS pour VPS, le meilleur service que j’ai vu et utilisé. Tant au niveau de la disponibilité (uptime de 100% pour moi), des ressources (ex: disques durs SSD), le prix (5$/mois!) et la documentation (pleins de tutoriels). Je n’ai pas eu besoin du support… mon compte a toujours été fonctionnel. Cela dit, le forum de support semble parler de lui-même! 🙂

      Cela dit, il est clair que ce service n’est pas aussi intégré qu’AWS d’Amazon (base de données « managed », load balancer, etc), mais le prix n’a rien à voir non plus.

      Si tu veux essayer leur service et avoir un 10$ de rabais à l’inscription, tu peux utiliser mon lien de référence:
      https://www.maximejobin.com/go/digitalocean

  • Salut maxime,
    Je vous remercie pour ce tuto que vous avez fait. Bon là j’ai déjà créez mon site sous wordpress est il possible d’installer nginx après l’installation et comment ci possible?

    Merci

  • Bonjour Maxime,

    Dans la dernière partie de l’article, après avoir ajouté les lignes suivantes:
    # Ajout de fichiers pour WordPress
    include wordpress/wp-restrictions.conf;
    include wordpress/wp-global.conf;
    #include wordpress/wp-multisite.conf;

    Il m’est impossible de rafraichir nginx, j’ai l’erreur suivante en retour:
    nginx[2121]: nginx: [emerg] open() « /etc/nginx/wordpress/wp-restrictions.conf » failed (2: No such file or directory) in /etc/nginx/sites-enabled/monsite.fr:26

    J’ai bien évidement changé monsite.fr par le bon nom de fichier, tout fonctionnait parfaitement jusqu’alors. Savez-vous d’où peut provenir cette erreur ?

    • Les lignes mentionnées ajoutent des fichiers dans votre configuration. Avez-vous créé les fichiers wp-restrictions.conf et wp-global.conf que vous auriez dû déposer dans /etc/nginx/wordpress/ ?

      • Permettez-moi de douter que vous avez fait la tâche correctement. Le message d’erreur de Nginx mentionne qu’il ne peut trouver le fichier.

        Si vous roulez la ligne de commande suivante:
        ls -l /etc/nginx/wordpress/

        Vous devriez obtenir le résultat suivant:
        total 16
        -rw-r–r– 1 root root 675 Jan 5 2015 wp-global.conf
        -rw-r–r– 1 root root 192 Jul 19 2014 wp-multisite.conf
        -rw-r–r– 1 root root 455 Jul 19 2014 wp-restrictions.conf

        Est-ce le cas ?

        Je pense que vous avez créé les fichiers… mais au mauvais endroit!

        • Lorsque je fait un ls -l /etc/nginx/wordpress, j’ai le résultat suivant
          total 12
          -rw-r–r– 1 root root 215 Oct 23 16:40 multisite.conf
          -rw-r–r– 1 root root 541 Oct 23 16:38 wp-global.conf
          -rw-r–r– 1 root root 440 Oct 23 16:39 wp-restriction.conf

          Ce n’est pas tout à fait le même résultat, y aurait-il un problème de droits sur les fichiers ?

          • Non! Le problème est qu’il manque un « s » à wp-restriction.conf.

            Le résultat ne peut être différent. Autrement, vous demandez à Nginx de lire un fichier dont le nom est X, mais vous avez créé un fichier avec le nom Y. Nginx ne peut donc pas trouver X. 🙂

  • Merci pour votre aide, c’était une erreur bête..
    Par contre, j’ai de nouveau des erreurs que voici:

    nginx[2121]: nginx: [emerg] open() « /etc/nginx/wordpress/wp-restrictions.conf » failed (2: No such file or directory) in /etc/nginx/sites-enabled/jusshome.fr:26
    nginx[2272]: nginx: [emerg] unknown directive « all » in /etc/nginx/wordpress/wp-restrictions.conf:18

    Ne faut-il pas modifier:

    # Refus de servir tous fichiers debutants avec un .
    location ~ /\. {
    all;
    }

    par:

    # Refus de servir tous fichiers debutants avec un .
    location ~ /\. {
    deny all;
    }

    ?

  • Allo Maxime! Wow… très bel article 🙂

    Je me demandais quel serait ton opinion au sujet de Ngnix Admin pour Cpanel. Est-ce que le gain est aussi ou se rapproche beaucoup de Ngnix seul? Ou si c’est carrément inutile?

    J’ai installé Ngnix admin sur un de mes VPS géré avec WHM-CPanel, et honnêtement, je ne semble pas voir une très grande différence au niveau de la rapidité de mes sites (Je suis sur un assez gros VPS sur lequel j’héberge 40 sites WordPress).

    Mon serveur n’a cependant pas de Loadaverage élevé (il n’en avait pas vraiment non plus sans NGnix. Du coup, je me demandais si on ne pouvait pas tester le serveur avec et sans NGnix (connais-tu une méthode infaillible.. ou presque ! 😀 )

    Merci !

    • De manière générale, lorsque vous utilisez Nginx avec cPanel, Nginx agit comme un « reverse proxy » ce qui fait en sorte qu’il accélère la rapidité de distribution des fichiers statiques et c’est tout. Apache est toujours là et fait encore une bonne partie du travail.

      Si vous souhaitez conserver votre panneau de contrôle (cPanel), l’amélioration devra se faire à un autre niveau.

      Si vous êtes ouvert à ne pas avoir cPanel, je vous recommande d’utiliser uniquement Nginx. Pour la même configuration matérielle, vous pourrez être plus efficace. À cela, j’ajouterais une extension (plugin) de cache comme WP-Rocket (http://wp-rocket.me). Finalement, si vous y allez avec cette configuration, ajoutez-y ma configuration pour WP-Rocket nommée Rocket-Nginx qui vous permettra de servir vos fichiers en cache sans aucun appel à PHP. La vitesse y sera ainsi maximisée.

      Bon succès!

      • Merci pour ta réponse (et les discussions via Twitter!). Par ailleurs, je suis satisfait de ce serveur. J’obtiens des A partout sur webpagetest.org et sur Ping Dom une moyenne de 2.2 secondes environs, en passant par le serveur de test de NY.

        Mais bon, .. comme on cherche toujours à s’améliorer … !

        Btw, quelle est la fonte que tu as utilisée pour ton titre Introduction à Ngnix?

  • Bravo et merci pour cet excellent tuto.

    Je me permets une petite erreur en début de tuto :

    « service start nginx » à remplacer par « service nginx start » !

  • Bonjour, je viens de suivre votre tuto pour monter un site sous nginx. Le tuto est très clair mais je suis novice. J’ai suivi toutes vos infos à la lettre et me retrouve avec le problème suivant :

    monsite.com me renvoie vers le fichier html Welcome to nginx. Je pense que j’ai soit mal configuré mon fichier de conf ou mon fichier hosts ne prend pas en compte mes modifications.

    Je suis sous Fedora mais je pense que cela n’a pas d’incidence sur le cheminement.

    Dans l’attente d’avoir une réponse.
    Ronan

    • Si tout t’envoie vers la page générique de Nginx, c’est que ta configuration n’est pas adéquate. Les trois pistes qui me viennent en tête:
      1) Tes fichiers de hosts ne sont pas lus (es-tu certain d’avoir inclus le bon répertoire ?).
      2) Ton fichier de host ne contient pas le bon host.
      3) Aurais-tu oublié de faire un service nginx reload (ou équivalent) après le changement de configuration ?

      Bon débogage!

  • Bonjour Maxime, j’ai finalement compris d’où venais le problème : la commande service nginx reload ne pouvait pas fonctionner correctement car j’avais une coquille dans mon fichier nginx.conf. J’ai constaté ce problème en stoppant le service et en tentant de le redémarrer. Un message d’erreur s’affichait dans mon terminal, j’ai identifié le pb et tout est rentré dans l’ordre ! Même /usr/sbin/nginx -t me retournait que tout était OK.

    Merci pour tes pistes cela m’a bien aidé!

    Bonne journée 🙂
    Ronan

  • Salut Maxime,
    Merci pour cet article, assez intéressant et surtout bien expliqué.
    Je travaille avec wordpress dans docker, je lance le conteneur wordpress, et j’obtiens la page d’accueil de nginx encore, malgré que wordpress est bien installé.
    Est-ce que tu en as une idée?
    Merci énormément

  • Bonjour Maxime et merci pour ton partage de connaissances,
    As-tu un ordre d’idée sur les améliorations apportée en termes de gains de vitesse de ta configuration par rapport à une config classique sous apache ?
    Je suis dans cette réflexion avec des résultats pour l’instant mitigés. Je n’obtiens pas mieux que ce que j’ai chez Gandi qui pourtant utilise des technos pas nécessairement des plus récentes (je pense http2, Brotli ..) – j’utilise WP-Roket également. Merci

    • En fait, c’est une combinaison de facteurs qui fait la différence. Pour servir du contenu généré via des fichiers PHP, Nginx ne sera pas nécessairement plus rapide. Certains benchmarks montrent même que ça pourrait être légèrement plus lent. La différence majeure avec Nginx, selon mon expérience, est la basse utilisation de ressource sur le serveur web et le fait qu’il est beaucoup plus efficace à servir des fichiers statiques.

      C’est d’ailleurs pour cela que j’ai combiné Nginx à WP-Rocket et que j’ai créé la configuration Rocket-Nginx. Là, tu verras une différence à l’oeil nu!

      • Merci de ce retour à rapide. J’avais vu ton tuto et c’est bien dans cette configuration que je souhaite m’inscrire. WP-Rocket est un produit très performant dans la génération de fichiers statiques. Bonne fin de journée