Serveur dédié : passer WordPress en HTTPS (TLS/SSL)

Vous avez sauté le pas et avez validé votre nom de domaine avec un certificat TLS/SSL. Très bien ! Voyons comment passer WordPress sur la version sécurisée de votre site.

Il existe des plugins WordPress entièrement dédiés à SSL pour rediriger vers les pages sécurisées mais on peut très bien faire sans, avec un peu d’huile de coude.

Le tutoriel est pour Debian et WordPress tourne sous Apache chez moi. Cela prend moins d’une heure pour configurer l’essentiel mais il est probable que vous ayez des petites corrections (thèmes, plugins) pour que tout soit servi en https.

Le but est de tout (oui, absolument tout!) servir via la connexion sécurisée.

Étape 1 : configurer Apache

On édite notre fichier de configuration :

nano /etc/apache2/sites-available/www.skyminds.net

et voici ce que garde pour VirtualHost *:80 :

ServerName www.skyminds.net
ServerAlias skyminds.net
DocumentRoot /home/skyminds/public_html/
Redirect 301 / https://www.skyminds.net/Code language: JavaScript (javascript)

La directive ServerName est nécessaire. Ensuite, une simple redirection renvoie toutes les requêtes du port 80 vers le port 443, sécurisé. Même pas besoin de mod_rewrite!

On déplace ensuite toutes nos règles WordPress dans VirtualHost *:443 :

ServerAdmin webmaster@localhost
ServerName www.skyminds.net
ServerAlias skyminds.net
DocumentRoot /home/skyminds/public_html/
LogLevel warn
CustomLog /var/log/apache2/www-access.log varnishcombined
ErrorLog /var/log/apache2/www-error.log

# SSL Certificate
# + Ciphers
# + Perfect Forward Secrecy rules
# relire https://www.skyminds.net/serveur-dedie-apache-https-perfect-forward-secrecy/

	
		AllowOverride None

		# BEGIN WordPress
		RewriteEngine On
		RewriteBase /
		# SSL
		RewriteCond %{SERVER_PORT} !^443$
		RewriteRule (.*) https://%{HTTP_HOST}%{REQUEST_URI} [R,L]
		# if this request is for "/" or has already been rewritten to WP
		RewriteCond $1 ^(index\.php)?$ [OR]
		# if request is for image, css, or js file
		RewriteCond $1 \.(gif|jpg|png|ico|css|js)$ [NC,OR]
		# or if URL resolves to existing file
		RewriteCond %{REQUEST_FILENAME} -f [OR]
		# or if URL resolves to existing directory
		RewriteCond %{REQUEST_FILENAME} -d
		# then skip the rewrite to WP
		RewriteRule ^(.*)$ - [S=1]
		# else rewrite the request to WP
		RewriteRule . /index.php [L]
		# END wordpress 

		Options FollowSymLinks
		Order allow,deny
		Allow from allCode language: PHP (php)

Vous remarquerez que mes règles WordPress ne sont pas tout à fait standards mais légèrement optimisées depuis quelques années déjà, de manière à limiter les traitements via PHP.

Dans le code ci-dessus, j’ai rajouté ceci pour prendre en compte SSL :

# SSL
RewriteCond %{SERVER_PORT} !^443$
RewriteRule (.*) https://%{HTTP_HOST}%{REQUEST_URI} [R,L]Code language: PHP (php)

Enregistrez le fichier et relancez Apache :

service apache2 restart

Lancez la version https de votre site et vérifiez que votre site est accessible.

Étape 2 : configurer WordPress pour HTTPS

La configuration pour HTTPS se fait en plusieurs étapes. J’ai tenu une liste de tout ce que j’ai eu à faire au fur et à mesure que j’avançais. Voici donc comment procéder.

On édite wp-config.php et on ajoute :

/* SSL
/* The constant FORCE_SSL_ADMIN can be set to true to force all logins and all admin sessions to happen over SSL. 
/* http://codex.wordpress.org/Administration_Over_SSL
*/ 
define('FORCE_SSL_ADMIN', true);Code language: PHP (php)

Cela force TLS/SSL sur l’administration et la page de connexion de WordPress.

On ajoute (ou on modifie) ensuite les constantes WP_SITEURL et WP_HOME de manière à faire apparaître https :

// HOME
define('WP_SITEURL', 'https://www.skyminds.net'); 
define('WP_HOME', 'https://www.skyminds.net');Code language: JavaScript (javascript)

J’ai une préférence pour définir ces constantes dans wp-config.php car je trouve cela plus sécurisé mais vous pouvez bien sûr les modifier dans les réglages généraux de WordPress (Réglages > Général).

Il est temps maintenant de modifier tous les liens du site. On recherche toutes les adresses qui commencent par :

http://www.skyminds.netCode language: JavaScript (javascript)

et on les remplace par :

http://www.skyminds.netCode language: JavaScript (javascript)

en lançant la requête SQL suivante :

UPDATE wp_posts SET post_content = REPLACE (post_content, 
'http://www.skyminds.net',
'https://www.skyminds.net');Code language: JavaScript (javascript)

On fait pareil pour les liens dans le texte des commentaires :

UPDATE wp_comments SET comment_content = REPLACE (comment_content, 
'http://www.skyminds.net',
'https://www.skyminds.net');Code language: JavaScript (javascript)

Etape optionnelle : si vous hébergez comme moi vos images sur un sous-domaine, il est nécessaire de suivre cette étape. Idéalement, il faut que ce sous-domaine serve lui aussi les fichiers en TLS/SSL. Passez à l’étape suivante si WordPress gère vos fichiers téléchargés sans configuration particulière de votre part.

Les images et fichiers joints vont poser problème : les fichiers ont été envoyés du temps où le serveur n’avait pas de certificat, donc toutes les images possèdent une adresse en http.

On recherche donc :

http://static.skyminds.netCode language: JavaScript (javascript)

Et on le remplace avec:

https://www.skyminds.net/wp-content/uploadsCode language: JavaScript (javascript)

Avec la requête SQL suivante:

UPDATE wp_posts SET post_content = REPLACE (post_content, 
'http://static.skyminds.net',
'https://www.skyminds.net/wp-content/uploads');
Code language: JavaScript (javascript)

Cela modifie l’URI des images déjà uploadées. Pour les futurs uploads, il faut aller dans Réglages > Media et mettre à jour Full URL path to files avec notre nouvelle adresse. (https://www.skyminds.net/wp-content/uploads)

Note : si vous ne trouvez pas Full URL path to files sur la page, installez le plugin WP Original Media Path, mettez à jour la valeur et désinstallez le plugin. Il ne sert qu’à inscrire la valeur dans la base de données.

Il faut ajouter cette fonction dans votre plugin de fonctionnalités :

//Fix SSL on Post Thumbnail URLs
// // https://core.trac.wordpress.org/ticket/15928
function ssl_post_thumbnail_urls($url, $post_id) {
 	//Skip file attachments
 	if( !wp_attachment_is_image($post_id) )
		return $url;
	//Correct protocol for https connections
		list($protocol, $uri) = explode('://', $url, 2);
		if( is_ssl() ) {
			if( 'http' == $protocol )
				$protocol = 'https';
		} else {
			if( 'https' == $protocol )
				$protocol = 'http';
		}
		return $protocol.'://'.$uri;
	}
add_filter('wp_get_attachment_url', 'ssl_post_thumbnail_urls', 10, 2);Code language: PHP (php)

Concrètement, cela teste si le site est servi par https et change l’URL des miniatures à la volée.

Modification, amélioration et nettoyage des fichiers du thème. Je me suis aperçu j’avais hard-codé, par habitude et fainéantise, la plupart des URI dans mon thème. Par conséquent, il existait pas mal de liens directs vers des fichiers en http, principalement dans header.php.

La solution est d’utiliser esc_url( home_url() ) autant que possible à chaque fois que l’on fait appel à un fichier:

<?php 
echo esc_url( home_url( '/favicon.ico' ) ); 
?>Code language: HTML, XML (xml)

A vérifier également : les liens du header, du menu, de la sidebar, du footer.

Etape 3 : nettoyage, why no padlock?

Voici les différentes icones SSL sous Chrome et leurs significations :

Icône	Signification
	Le site n’utilise pas SSL.Cette icône s’affiche pour les sites en http. La plupart des sites n’ont pas besoin d’utiliser SSL, car ils ne gèrent pas des informations confidentielles. Évitez de saisir des informations telles que le numéro de votre carte de paiement ou les informations de connexion à votre banque sur la page. Si des informations confidentielles vous sont demandées sur un site n’utilisant pas le protocole SSL, vous pouvez contacter le propriétaire du site Web.
	Google Chrome a réussi à établir une connexion sécurisée avec le site. Repérez cette icône et assurez-vous que le domaine de l’URL est correct si vous êtes invité à vous connecter à ce site ou à saisir des informations confidentielles sur cette page. Si le site utilise un certificat EV-SSL (Extended Validation SSL), le nom de l’entreprise s’affiche en vert à côté de l’icône.
	Le site emploie le protocole SSL, mais Google Chrome a détecté des éléments non sécurisés sur la page. Soyez prudent si vous saisissez des informations confidentielles sur cette page. Tout contenu non sécurisé constitue une faille qu’une personne mal intentionnée peut utiliser pour modifier l’aspect de la page.
	Le site utilise SSL, mais du contenu non sécurisé à risque élevé ou des problèmes relatifs au certificat du site ont été détectés sur la page. Ne saisissez pas d’informations confidentielles sur cette page. Un certificat non valide ou d’autres problèmes HTTPS sérieux peuvent indiquer qu’un tiers est en train de tenter de détourner votre connexion au site.

Il ne vous reste plus qu’à traquer les dernières occurences http et les modifier en https. Le but est d’obtenir le petit cadenas vert : tous les éléments de la page (images, scripts) doivent être servis via HTTPS.

S’il reste des éléments récalcitrants, essayez l’outil en ligne Why No Padlock ? qui permet d’identifier les éléments de la page qui ne sont pas servis par https.

C’est l’étape qui prend pas mal de temps mais permet d’identifier où la validation SSL complète des pages coince.

Étape 4 : indexation

À ce stade, WordPress devrait maintenant être passé entièrement à HTTPS/TLS. Videz le cache et les cookies, relancez Apache et revisitez le site en https.

Il nous reste maintenant à informer les robots de notre changement d’adresse. Voici une dernière checklist pour leur faciliter la tâche :

1. réactualisez vos sitemaps pour que les nouvelles URI soient prises en compte.
2. corrigez les liens vers les sitemaps dans robots.txt.
3. enregistrez la nouvelle URL du site dans Google Webmaster Tools et Bing Webmaster Tools, validez le site, ajoutez vos sitemaps pour l’indexation.

Il ne reste plus qu’à attendre la visite des robots et la mise à jour de l’index des moteurs de recherche.

Conclusion

Voilà, nous touchons à la fin de ce tutoriel. Voilà ce que nous venons de mettre en place sur notre site WordPress : redirection vers HTTPS dans Apache, modification des URI des articles/images/miniatures, admin et login sécurisés, optimisation du thème, et quelques conseils pour l’indexation du site.

Articles conseillés :

• Serveur dédié : sécuriser Apache avec HTTPS (HTTP avec la couche TLS/SSL) en Perfect Forward Secrecy
• Serveur dédié : configurer Postfix et Courier pour utiliser TLS-SSL en Perfect Forward Secrecy
• Serveur dédié : configurer Transmission pour accéder au WebUI via TLS-SSL
• Serveur dédié : configurer Webmin en TLS avec un certificat SSL
• Serveur dédié : mettre à jour Apache pour HTTP/2
• Serveur dédié : produire une meilleure réserve d’entropie avec haveged