HTTPS en local sur Mac : créer un certificat SSL avec mkcert (2026)

Vous développez une PWA et les Service Workers refusent de s'activer ? Votre application utilise la Geolocation API et elle ne fonctionne qu'en production ? Le coupable : l'absence de HTTPS en local. Ce guide vous montre comment résoudre ça définitivement avec mkcert.

Pourquoi HTTPS en local ?

APIs qui requièrent HTTPS

De nombreuses APIs web modernes ne fonctionnent qu'en contexte sécurisé (HTTPS) :

• Service Workers : Requis pour les PWA
• Geolocation API : Position GPS
• Clipboard API : Copier/coller
• WebRTC : Vidéo/audio
• Web Bluetooth : Appareils Bluetooth
• Notifications Push : Push API

Autres avantages

• Parité dev/prod : Même comportement partout
• Cookies sécurisés : Test des attributs Secure et SameSite
• HTTP/2 : Requiert HTTPS
• Crédibilité : Pas d'avertissement navigateur

Installation de mkcert

Qu'est-ce que mkcert ?

mkcert est un outil créé par Filippo Valsorda qui : 1. Crée une autorité de certification (CA) locale 2. Installe cette CA dans votre système et navigateurs 3. Génère des certificats signés par cette CA

Résultat : vos certificats locaux sont reconnus comme valides.

Installation sur Mac

# Avec Homebrew
brew install mkcert

# Installer les certificats racine
mkcert -install

Vous verrez un message demandant votre mot de passe pour installer la CA dans le trousseau système.

Vérifier l'installation

mkcert -CAROOT

Affiche le dossier contenant votre CA locale.

Créer des certificats

Pour localhost

mkcert localhost 127.0.0.1 ::1

Crée deux fichiers :

• localhost+2.pem : Le certificat
• localhost+2-key.pem : La clé privée

Pour un domaine personnalisé

mkcert monprojet.test

Avec wildcard (sous-domaines)

mkcert monprojet.test "*.monprojet.test"

Permet d'utiliser api.monprojet.test, admin.monprojet.test, etc.

Certificat tout-en-un

mkcert localhost 127.0.0.1 ::1 monprojet.test "*.monprojet.test"

Configurer votre serveur

Node.js / Express

const https = require('https');
const fs = require('fs');
const express = require('express');

const app = express();

const options = {
    key: fs.readFileSync('./localhost+2-key.pem'),
    cert: fs.readFileSync('./localhost+2.pem')
};

https.createServer(options, app).listen(3000, () => {
    console.log('HTTPS server running on https://localhost:3000');
});

Vite

// vite.config.js
import { defineConfig } from 'vite';
import fs from 'fs';

export default defineConfig({
    server: {
        https: {
            key: fs.readFileSync('./localhost+2-key.pem'),
            cert: fs.readFileSync('./localhost+2.pem')
        }
    }
});

Next.js

// next.config.js avec serveur custom
const { createServer } = require('https');
const { parse } = require('url');
const next = require('next');
const fs = require('fs');

const dev = process.env.NODE_ENV !== 'production';
const app = next({ dev });
const handle = app.getRequestHandler();

const httpsOptions = {
    key: fs.readFileSync('./localhost+2-key.pem'),
    cert: fs.readFileSync('./localhost+2.pem')
};

app.prepare().then(() => {
    createServer(httpsOptions, (req, res) => {
        const parsedUrl = parse(req.url, true);
        handle(req, res, parsedUrl);
    }).listen(3000);
});

Webpack Dev Server

// webpack.config.js
const fs = require('fs');

module.exports = {
    devServer: {
        https: {
            key: fs.readFileSync('./localhost+2-key.pem'),
            cert: fs.readFileSync('./localhost+2.pem')
        }
    }
};

Utiliser avec des domaines personnalisés

Configurer le fichier hosts

Pour utiliser monprojet.test au lieu de localhost :

# /etc/hosts
127.0.0.1    monprojet.test
127.0.0.1    api.monprojet.test

Créer le certificat correspondant

mkcert monprojet.test "*.monprojet.test"

Configurer le serveur

Utilisez les nouveaux fichiers générés dans votre configuration serveur.

Cas d'usage avancés

Laravel Valet

Valet intègre mkcert nativement :

valet secure monprojet

C'est tout ! Valet génère et configure automatiquement les certificats.

Docker

# docker-compose.yml
services:
  web:
    volumes:
      - ./certs:/etc/nginx/certs:ro
    environment:
      - VIRTUAL_HOST=monprojet.test
      - CERT_NAME=monprojet.test

MAMP Pro

1. Préférences > Hosts 2. Sélectionnez votre host 3. SSL > Activer 4. Importez vos certificats mkcert

Dépannage

"NET::ERR_CERT_AUTHORITY_INVALID"

La CA n'est pas installée dans le navigateur.

mkcert -install

Puis redémarrez votre navigateur.

Chrome ignore toujours le certificat

Chrome peut nécessiter un redémarrage complet :

# Mac
killall "Google Chrome"
open -a "Google Chrome"

Firefox ne reconnaît pas la CA

Firefox utilise son propre magasin de certificats. Installez-la manuellement : 1. Préférences > Vie privée et sécurité > Certificats 2. Voir les certificats > Autorités > Importer 3. Sélectionnez rootCA.pem depuis mkcert -CAROOT

Bonnes pratiques

Organisation des certificats

~/certs/
├── localhost/
│   ├── localhost+2.pem
│   └── localhost+2-key.pem
├── monprojet.test/
│   ├── monprojet.test+1.pem
│   └── monprojet.test+1-key.pem
└── README.md

Ne jamais committer les clés

# .gitignore
*.pem
certs/

Script de setup projet

#!/bin/bash
# setup-certs.sh
mkdir -p certs
cd certs
mkcert localhost 127.0.0.1 ::1 monprojet.test "*.monprojet.test"
echo "Certificats créés dans ./certs/"

Alternatives à mkcert

Certificats auto-signés (déconseillé)

Fonctionnent mais génèrent des avertissements navigateur constants.

Tunnels (ngrok, localtunnel)

Exposent votre localhost sur Internet avec HTTPS. Utile pour tests mobiles ou webhooks.

Caddy

Serveur web avec HTTPS automatique, même en local.

Conclusion

HTTPS en local n'est plus optionnel en 2026. Avec mkcert, l'installation prend 2 minutes et vous évite des heures de frustration avec les APIs modernes. Combinez-le avec des domaines .test gérés via Locahl pour un environnement de développement professionnel.