まえがき
ローカル開発環境でも https が必須になる場面は年々増えています。
OAuth、Service Worker、HTTP/2、SameSite Cookie など、https 前提の仕様が当たり前になりました。
本記事では、
- Windows
- WSL2
- Docker
- Nginx
という構成で、ブラウザ警告なしの SSL を
mkcert を使って構築する方法を解説します。
構成イメージ
Windows
└─ WSL2 (Ubuntu)
└─ Docker
└─ Nginx (https)
- 証明書は mkcert
- Nginx は Docker コンテナ
- ブラウザ警告なしで https アクセス可能
Docker Desktopがあらかじめインストールされている前提で話を進めていきます。
ディレクトリ構成
今回のサンプルで使用するディレクトリ構成は下記の通りです。
project/
├─ docker-compose.yml
├─ nginx/
│ └─ default.conf
└─ certs/
├─ myapp.pem
└─ myapp-key.pem
なぜ mkcert を使うのか
ローカル SSL には openssl を使う例も多いですが、以下の問題があります。
- 毎回ブラウザ警告が出る
- Chrome / Edge / Firefox で扱いが違う
- 開発体験が悪い
mkcert はこれらをすべて解決します。
mkcert の特徴
- ローカル専用の認証局（CA）を自動作成
- OS・ブラウザに信頼済み CA を登録
- Chrome / Edge / Firefox すべて警告なし
- Docker / Nginx と相性が良い
1. WSL に mkcert をインストール
ここでは Ubuntu（WSL）を前提にします。
sudo apt update
sudo apt install -y libnss3-tools
curl -JLO "https://dl.filippo.io/mkcert/latest?for=linux/amd64"
chmod +x mkcert-v*-linux-amd64
sudo cp mkcert-v*-linux-amd64 /usr/local/bin/mkcert
※公式のビルド済みバイナリをインストールする方法を採用 mkcertのインストール - Linux
動作確認
mkcert -version
2. ローカル認証局（CA）を作成
最初に 1回だけ 実行します。
mkcert -install
これで以下が自動で行われます。
- ローカル CA を生成
- OS に信頼済み証明書として登録
- Firefox 用の NSS DB にも登録
3. ルート証明書をWindows側に登録
「OSに信頼済み証明書として登録」はwsl側のOSに登録されただけです。ブラウザはWindows側で開くためWindows側にもルート証明書を登録する必要があります。
下記の手順を実行してWinodwsにもルート証明書を登録しましょう。
3-1. ルート証明書が格納されているディレクトリを確認
まずは下記コマンドでmkcertで生成されたルート証明書の場所を確認します。
mkcert -CAROOT
/home/username/.local/share/mkcert
mkcertディレクトリを確認すると、rootCA.pem（公開鍵）があります。
$ tree /home/username/.local/share/mkcert
/home/username/.local/share/mkcert
├── rootCA-key.pem
└── rootCA.pem
このrootCA.pemをWindowsにルート証明書として登録します。
3-2. Windows側で参照できるフォルダに移動
mkcertで作成したルート証明書をWindows側で参照できるようにダウンロードフォルダにコピーします。
cp $(mkcert -CAROOT)/rootCA.pem /mnt/c/Users/<Windowsユーザー名>/Downloads/
※ <Windowsユーザー名> は実際の名前に置き換えてください
3-3. Windowsにルート証明書を登録
Win + Rで「ファイル名を指定して実行」から「certmgr.msc」と入力しユーザーの証明書を管理するアプリを起動します。
「信頼されたルート証明機関」を開き、「証明書」を右クリック ＞ すべてのタスク ＞ インポートをクリックします。
「証明書のインポートウィザード」が開くのでそのまま「次へ」をクリックします。
参照をクリックします。
右下のファイルの種類を「すべてのファイル (*.*)」に変更し、先ほどコピーしたrootCA.pemを選択し「開く」をクリックします。
「次へ」をクリックします。
「証明書をすべて次のストアに配置する」が選択されている状態で「次へ」をクリックします。
「完了」をクリックします。
すると「セキュリティ警告」が表示されますが、自分でmkcertを使って作成したルート証明書なので「はい」をクリックします。
証明書の一覧にmkcertで追加したものがあれば、ルート証明書の登録は完了です。
4. ローカル用 SSL 証明書を発行
次にローカル用SSL証明書を発行します。
certsディレクトリを作成し、
mkdir certs
cd certs
下記コマンドでSSL証明書を発行します。
mkcert \
-cert-file myapp.pem \
-key-file myapp-key.pem \
myapp.test localhost 127.0.0.1
生成されるファイルは下記の通りです。
myapp.pem
myapp-key.pem
5. docker-compose.yml を作成
下記内容で、docker-compose.ymlファイルを作成します。
services:
nginx:
image: nginx:stable
container_name: myapp-nginx
ports:
- "8443:443"
volumes:
- ./nginx/default.conf:/etc/nginx/conf.d/default.conf:ro
- ./certs:/etc/nginx/certs:ro
restart: unless-stopped
6. Nginx の SSL 設定
nginxディレクトリを作成し、
mkdir nginx
nginxディレクトリ直下に下記内容で、default.confファイルを作成します。
server {
listen 443 ssl;
server_name localhost myapp.test;
ssl_certificate /etc/nginx/certs/myapp.pem;
ssl_certificate_key /etc/nginx/certs/myapp-key.pem;
ssl_protocols TLSv1.2 TLSv1.3;
ssl_ciphers HIGH:!aNULL:!MD5;
root /usr/share/nginx/html;
index index.html;
location / {
try_files $uri $uri/ =404;
}
}
7. コンテナ起動
projectディレクトリの直下に移動し下記コマンドを実行します。
docker compose up -d
docker logs myapp-nginxコマンドでnginxのログを出力しエラーなく起動していることを確認します。
$ docker logs myapp-nginx
/docker-entrypoint.sh: /docker-entrypoint.d/ is not empty, will attempt to perform configuration
/docker-entrypoint.sh: Looking for shell scripts in /docker-entrypoint.d/
/docker-entrypoint.sh: Launching /docker-entrypoint.d/10-listen-on-ipv6-by-default.sh
10-listen-on-ipv6-by-default.sh: info: can not modify /etc/nginx/conf.d/default.conf (read-only file system?)
/docker-entrypoint.sh: Sourcing /docker-entrypoint.d/15-local-resolvers.envsh
/docker-entrypoint.sh: Launching /docker-entrypoint.d/20-envsubst-on-templates.sh
/docker-entrypoint.sh: Launching /docker-entrypoint.d/30-tune-worker-processes.sh
/docker-entrypoint.sh: Configuration complete; ready for start up
2025/12/26 04:27:52 [notice] 1#1: using the "epoll" event method
2025/12/26 04:27:52 [notice] 1#1: nginx/1.28.1
2025/12/26 04:27:52 [notice] 1#1: built by gcc 14.2.0 (Debian 14.2.0-19)
2025/12/26 04:27:52 [notice] 1#1: OS: Linux 6.6.87.2-microsoft-standard-WSL2
2025/12/26 04:27:52 [notice] 1#1: getrlimit(RLIMIT_NOFILE): 1048576:1048576
2025/12/26 04:27:52 [notice] 1#1: start worker processes
2025/12/26 04:27:52 [notice] 1#1: start worker process 21
2025/12/26 04:27:52 [notice] 1#1: start worker process 22
2025/12/26 04:27:52 [notice] 1#1: start worker process 23
2025/12/26 04:27:52 [notice] 1#1: start worker process 24
2025/12/26 04:27:52 [notice] 1#1: start worker process 25
2025/12/26 04:27:52 [notice] 1#1: start worker process 26
2025/12/26 04:27:52 [notice] 1#1: start worker process 27
2025/12/26 04:27:52 [notice] 1#1: start worker process 28
2025/12/26 04:27:52 [notice] 1#1: start worker process 29
2025/12/26 04:27:52 [notice] 1#1: start worker process 30
2025/12/26 04:27:52 [notice] 1#1: start worker process 31
2025/12/26 04:27:52 [notice] 1#1: start worker process 32
8. hostsファイルの編集（Windows側の作業）
hostsファイルに下記を追記します。
127.0.0.1 myapp.test
C:\Windows\System32\drivers\etc\
hostsファイルの更新は管理者権限が必要なため、メモ帳を右クリックして「管理者として実行」を選んでhostsファイルを開いてください。
こうしないと上書きできません。
9. ブラウザで確認
以下にアクセスします。
https://myapp.test:8443
✔ 警告なしでアクセスできれば成功です
よくあるハマりポイント
証明書を差し替えたのに反映されない
証明書を作り直した場合は下記を実行してコンテナを再起動してください。
docker compose restart nginx
myapp.testだけ「このサイトにアクセスできません」となる
hostsファイルに下記が記載されているか確認しましょう。
127.0.0.1 myapp.test
hostsファイルは下記にあります。
C:\Windows\System32\drivers\etc\
SSL証明書の警告が出る
ルート証明書をwindows側に登録 の手順をみなおしてルート証明書が正しくWindowsに登録されているか確認しましょう。
まとめ
- ローカル SSL は mkcert 一択
- Docker + Nginx + WSL でも簡単に構築できる
- ブラウザ警告なしで本番に近い環境を再現可能
