Vous avez réussi à exposer votre site sur le web mais celui-ci n'est pas encore en HTTPS ? Vous souhaitez sécuriser l'échange de données entre vos visiteurs et votre site ? Ou plus simplement, le référencement SEO de votre site nécessite le passage en HTTPS. Peu importe vos raisons, je vais vous expliquer comment obtenir votre A+ sur ssllabs ( pour le certificat SSL ) mais aussi sur SecurityHeaders ( en-têtes de sécurité envoyées par votre serveur au navigateur web ) au cours des deux prochains articles.

Les bases

Je ne vais pas revenir sur les bases du TLS et sur la nécessité pour votre site d'avoir ce fameux sésame. Je vous invite à consulter l'excellent article de Teddy Ferdinand sur la configuration du TLS avec Traefik. Il aborde le principe de base du fonctionnement du protocole TLS de façon très détaillée.

Je vais surtout rappeler que pour tester votre certificat SSL, rien de plus simple. Vous pouvez vous rendre à l'addresse https://www.ssllabs.com/ et renseignez l'url de votre site. De plus il existe tout simplement le même outil pour vos en-têtes de sécurité envoyées dans la requête HTTP ou HTTPS de votre serveur vers le navigateur : https://securityheaders.com

Attardons-nous un peu plus sur ces Headers. À quoi servent-ils ?

La plus part d'entre eux, ont pour but de vous protéger d'une éventuelle infection d'un site web ciblé par un malware. Késako ki dit le Monsieur ?

Allons-y par l'exemple ! Avec un site actuellement infecté par un malware : https://www.imminence.fr ( cliquez dessus si vous le souhaitez, rien de monstrueux! C'est juste désagréable... )

Pour les plus timides ( ou si l'admin du site sort la sauvegarde 😃 ), j'ai cliqué pour vous :

Redirection site web par malware

Bref vous avez tous déjà cliqué sur un site qui semblait légitime et finalement vous arrivez ... sur un jeu truqué, ou alors des pop-up à l'infini avec le dernier Iphone en gros lot, etc, etc.

Pourtant ce site semble être en HTTPS... Oui mais voila, il utilise des plugins qui ne sont pas à jour et qui ont permis l'injection de code javascript sur les pages.

Avec le temps, des Headers de securité sont donc apparus afin de prémunir l'internaute de ce type d'attaque. Il existe quelques headers que je vais expliquer brièvement ici, commençons par les plus "anciens" :

  • X-Frame-Options : On interdit, ou on autorise, le chargement du site depuis un autre site ( technique de l'iframe ).
  • X-Xss-Protection : Elle va permettre de bloquer l'injection de code HTML ou JS sur votre site.
  • X-Content-Type-Options : Force le navigateur à utiliser le type de données envoyés par le serveur et uniquement celui-ci ( Oui sans cette directive, votre navigateur peut essayer d'interpréter une image comme du texte par exemple )
  • Content-Security-Policy : Abrégé CSP, ce header permet de restreindre l'origine des scripts exécutés par vos pages aux sites que vous autorisez.

Enfin les plus récents :

  • Strict-Transport-Security : Permet de forcer votre navigateur à utiliser le HTTPS pour accéder à votre site.
  • Referrer-Policy : Permet de contrôler les informations de pages "référentes" envoyés aux autres urls ( Vous pouvez consulter le site alsacreation à ce sujet, l'explication est bien détaillée )
  • Feature-Policy : Votre navigateur est devenu un vrai système d'exploitation... Il peut accéder à votre micro, webcam, la géolocalisation, etc... Cette en-tête permet de déclarer à quel type de ressource vous allez accéder : Je peux très bien informer votre navigateur que mon site ne demandera jamais l'accès à votre webcam ( et oui c'est pas mal les headers de sécurité hein ... )
  • Expect-Ct : Le petit dernier, il vise à renforcer la sécurité des certificats. Les autorités de certification vont maintenant enregistrer chaque certificat délivrer et rendre cette information accessible via une API. Cela permettra de s'assurer que le certificat reçu par le navigateur est correct. ( Je ne souhaite pas rentrer dans le détail des explications ici, vous pouvez trouver cette information ici : https://www.certificate-transparency.org/how-ct-works ).

Ok passons à l'action maintenant !

Implémentation du SSL :

En réalité avec Traefik c'est toujours simple ... Il nous suffit de déclarer un nouveau point d'entrée dans notre configuration et l'utilisation du protocole ACME ( traefik.yml ) :

    entryPoints:
        http:
            address: :80

        https:
            address: :443

    certificatesResolvers:
        myhttpchallenge:
            acme:
                email: "XXX@XXXX"
                storage: "/letsencrypt/acme.json"
                httpChallenge:
                    entryPoint: web

Enfin dans notre service, via les labels, nous allons pouvoir déclarer l'utilisation du HTTPS et demander la génération d'un certificat via ACME :

labels:
    - "traefik.enable=true"
    - "traefik.docker.network=traefik"
    - "traefik.http.services.monblog.loadbalancer.server.port=2368"
    - "traefik.http.routers.monblog.rule=Host(`ghost.mondomaine.fr`)"
    - "traefik.http.routers.monblog.entrypoints=http"
    - "traefik.http.routers.monblog-https.rule=Host(`ghost.mondomaine.fr`)"
    - "traefik.http.routers.monblog-https.entrypoints=https"
    - "traefik.http.routers.monblog-https.tls=true"
    - "traefik.http.routers.monblog-https.tls.certresolver=myhttpchallenge" 

Ce n'est pas nécessaire mais je vous conseille fortement d'utiliser un volume pour sauvegarder vos certificats dans la déclaration de Traefik :

    reverse-proxy:
        image: traefik:2.1
    ....
        volumes:
          - /var/run/docker.sock:/var/run/docker.sock
          - ./traefik.yml:/etc/traefik/traefik.yml:ro
          - ./conf:/etc/traefik/conf:ro
          - traefik_ssl:/letsencrypt
    ....

volumes:  
  traefik_ssl:
    name: traefik_ssl

Relancez-votre stack et rendez-vous sur https://ghost.mondomaine.fr !


Voilà qui clôture notre premier article sur ce sujet. En vous rendant sur SSLLABS, vous allez vite comprendre que votre site n'a pas encore son A+ mais ne vous inquiétez pas, ce sera le cas au prochain épisode 😅

La suite, c'est par ici : Traefik - SSL et let's encrypt, obtenir son A+ sur SSLLABS.

N'hésitez pas à faire vos commentaires ou à suivre les publications sur Twitter !