Les problèmes du certificat SSL Gratuit de Cloudflare et Win XP

CloudFlare propose un service de gestion des DNS hautement performant, avec des protections contre les attaques (DDOS principalement), un CDN, et un système de compression et d’accélération de vos pages, comme le faisait un peu le service PageSpeed de Google récemment fermé, même s’il n’a jamais été ouvert au public (et si vous voulez configurer votre propre pagespeed, Jessy vous l’explique ici).

A cela, il propose également un certificat SSL, et le tout cela est … gratos. Bon bien sur, vous avez une version payante qui vous propose plus de fonctionnalités, et lève même le problème dont je vais vous proposer une solution ici : leur certificat SSL n’est pas compatible avec les navigateurs ne supportant pas le SNI.

Vos visiteurs se retrouvent avec un beau message d’erreur : ERR_SSL_VERSION_OR_CIPHER_MISMATCH

erreur-ssl-cloudflare

Ça comprends donc Windows XP, les versions d’Android < 3, et les utilisateurs d’Internet Explorer <= 8.

On va rediriger les visiteurs vers la version https ou http en fonction de leur possibilité.

Que l’on soit bien d’accord, j’expose ici une solution dans le cas ou vous utilisez le certificat gratuit de CloudFlare, en mode « Flex », c’est à dire que CloudFlare crypte les échanges entre le visiteur et CloudFlare, mais pas entre CloudFlare et votre serveur.

Vous ne pouvez donc pas détecter classiquement le HTTPS, car c’est CloudFlare qui visite votre site directement, en HTTP.

Il faut passer par la variable serveur CF-Visitor, que vous pouvez consulter en php de cette façon :

$_SERVER["HTTP_CF_VISITOR"]

Elle vous retournera un tableau JSON :

{"scheme":"http"} ou {"scheme":"https"}

On serait tenté de faire une redirection 301 dès que l’on détecte un « http » vers la version https, mais vous allez vous priver d’une partie de votre audience : les visiteurs utilisant Win XP, Android dans la version 1, 2 ou 3 et Internet Explorer 5, 6, 7 et 8 (bouuuu).

Chez moi, globalement, cela représente 1.5% des visiteurs, pour 1.8% du chiffre d’affaire. Quand même.

Il faut donc détecter le système d’exploitation ainsi que le navigateur.

Plutôt que de passer par du code PHP, je passe directement par le fichier de configuration d’Apache, mais vous pouvez placer ce morceau de code dans votre fichier .htaccess (à mettre après votre RewriteEngine On) :

 

La redirection 307 permet de ne pas perdre les données d’entêtes (POST principalement …), de façon temporaire (comme une 302 quoi).

Voila, plus de perte de visiteur, et vous bénéficierez d’un certificat SSL valide gratos, qui passe partout (mieux en tout cas que celui de Gandi).

Il ne vous reste plus qu’à modifier votre code pour que les fichiers CSS et JS externe ce chargent dans la bonne version (//: à la place du traditionnel http:// et c’est réglé).