Utiliser HTTPS en local


Il devient de plus en plus fréquent d’avoir à utiliser la version sécurisée du protocole HTTP afin de pouvoir utiliser des API tiers permettant de payer en ligne par exemple. Cette contrainte peut aussi être exigée en environnement de développement et dans les navigateurs, un avertissement lié à la sécurité demandant confirmation de votre part apparaît à chaque ouverture de page.

Pour supprimer cette lourde contrainte, voici la démarche à suivre.

Configuration du serveur HTTP

Dans le but de simplifier au maximum cette procédure, je vous ai développé le script BASH ci-dessous.

  1
  2
  3
  4
  5
  6
  7
  8
  9
 10
 11
 12
 13
 14
 15
 16
 17
 18
 19
 20
 21
 22
 23
 24
 25
 26
 27
 28
 29
 30
 31
 32
 33
 34
 35
 36
 37
 38
 39
 40
 41
 42
 43
 44
 45
 46
 47
 48
 49
 50
 51
 52
 53
 54
 55
 56
 57
 58
 59
 60
 61
 62
 63
 64
 65
 66
 67
 68
 69
 70
 71
 72
 73
 74
 75
 76
 77
 78
 79
 80
 81
 82
 83
 84
 85
 86
 87
 88
 89
 90
 91
 92
 93
 94
 95
 96
 97
 98
 99
100
101
102
103
104
105
106
107
108
109
#!/usr/bin/env bash

if [ -z $(which openssl) ]; then
    echo -e "\e[31mThe package openssl is required.\e[39m"
    exit
fi

_output_dir=$( cd "$( dirname "${BASH_SOURCE[0]}" )" && pwd )
echo "Output directory? [${_output_dir}]"
read
if [ ! -z ${REPLY} ]; then
    _output_dir=${REPLY}
fi

if [ ! -d ${_output_dir} ]; then echo "This directory doesn't exist."; exit 1; fi

_project_name="MyProject"
echo "Project name? [${_project_name}]"
read
if [ ! -z ${REPLY} ]; then
    _project_name=${REPLY}
fi
_authority="${_project_name}"


_project_domain="my-project.localhost"
echo "Project domain? [${_project_domain}]"
read
if [ ! -z ${REPLY} ]; then
    _project_domain=${REPLY}
fi
_name="${_project_domain}"

_cert_pem=${_output_dir}/${_name}.pem
_cert_crt=${_output_dir}/${_name}.crt
_cert_key=${_output_dir}/${_name}.key

_key=/tmp/${_name}.key
_cn=${_name}
_csr_cnf=/tmp/${_name}.csr.cnf
_csr=/tmp/${_name}.csr
_v3_ext=/tmp/${_name}.v3.ext
_srl=/tmp/${_name}.srl

cat << EOF > ${_csr_cnf}
[req]
default_bits = 2048
prompt = no
default_md = sha256
distinguished_name = dn

[dn]
O=${_authority}
CN=${_name}
EOF

cat << EOF > ${_v3_ext}
authorityKeyIdentifier=keyid,issuer
basicConstraints=CA:FALSE
keyUsage = digitalSignature, nonRepudiation, keyEncipherment, dataEncipherment
subjectAltName = @alt_names

[alt_names]
DNS.1 = ${_name}
DNS.2 = *.${_name}
EOF

openssl genrsa -out ${_key} 2048 >/dev/null 2>&1

openssl req -x509 -new -nodes -key ${_key} -sha256 -days 3650 -out ${_cert_pem} -subj "/O=${_authority}/CN=${_cn}" >/dev/null 2>&1

openssl req -new -sha256 -nodes -out ${_csr} -newkey rsa:2048 -keyout ${_cert_key} -config <( cat ${_csr_cnf} ) >/dev/null 2>&1

openssl x509 -req -in ${_csr} -CA ${_cert_pem} -CAcreateserial -CAserial ${_srl} -CAkey ${_key} -out ${_cert_crt} -days 3650 -sha256 -extfile ${_v3_ext} >/dev/null 2>&1

_vhost_apache=${_output_dir}/${_name}.vhost-apache.conf
_vhost_nginx=${_output_dir}/${_name}.vhost-nginx.conf

cat << EOF > ${_vhost_apache}
<IfModule mod_ssl.c>
	<VirtualHost _default_:80>
		ServerName ${_name}
		Redirect / https://${_name}
	</VirtualHost>
	<VirtualHost _default_:443>
		ServerName ${_name}
		SSLCertificateFile "/etc/ssl/certs/${_name}.crt"
		SSLCertificateKeyFile "/etc/ssl/private/${_name}.key"
		DocumentRoot /var/www/html
	</VirtualHost>
</IfModule>
EOF

cat << EOF > ${_vhost_nginx}
server {
	listen 80 default_server;
	listen [::]:80 default_server;
    server_name ${_name};
    return 302 https://\$server_name\$request_uri;
}
server {
	listen 443 ssl default_server;
	listen [::]:443 ssl default_server;
	root /var/www/html;
    server_name ${_name};
    ssl_certificate /etc/ssl/certs/${_name}.crt;
    ssl_certificate_key /etc/ssl/private/${_name}.key;
}
EOF

Injectez le contenu du script dans un fichier puis exécutez-le avec la commande $ bash [file_path] en suivant les indications.

Attention, veillez à bien conserver le fichier [project_domain].pem, qui sera utilisé plus tard lors de la configuration des navigateurs.

Activez le module SSL si vous utilisez Apache.

Ajoutez l’hôte virtuel correspondant au programme que vous utilisez en l’adaptant selon les chemins et vos besoins spécifiques :

Configuration de Google Chrome

Rendez-vous sur la page dédiée à la configuration des certificats SSL : chrome://settings/certificates

Configuration de Mozilla Firefox

Rendez-vous sur la page dédiée à la configuration des certificats SSL : about:preferences#privacy

Testez la mise en place en allant à l’adresse suivante : https://[project_domain]

Vous pouvez maintenant développer localement de manière sécurisée et sans avertissement de la part de votre navigateur.

J’espère que ce tutoriel vous aura plu, et n’hésitez pas à poster vos commentaires.