Docker × Laravel ローカル環境でHTTPS(SSL)通信する

ローカル環境でもHTTPS通信したいという要望があり、ちょうど最近仕事でやる機会があったのでQiitaにもまとめたいと思います。

環境

• Mac

Laravel環境

• https://github.com/ucan-lab/docker-laravel
  • v.2.1.0
• 最強のLaravel開発環境をDockerを使って構築する【新編集版】

$ git clone [e-mail]:ucan-lab/docker-laravel.git
$ cd docker-laravel

$ mkdir -p src
$ docker compose up -d
$ docker compose exec app composer create-project --prefer-dist laravel/laravel .
$ docker compose exec app php artisan key:generate
$ docker compose exec app php artisan storage:link
$ docker compose exec app chmod -R 777 storage bootstrap/cache
$ docker compose exec app php artisan migrate

認証局、鍵の準備

mkcert, nssのインストール

• https://github.com/FiloSottile/mkcert
  • ローカルで信頼できる開発証明書を作成するためのツール
• https://developer.mozilla.org/en-US/docs/Mozilla/Projects/NSS
  • Network Security Services
  • FirefoxでlocalhostのSSLを有効化するために必要

$ brew install mkcert nss

ローカル認証局(CA： Certification Authority)の作成

$ mkcert -install

ChromeのSSL警告をlocalhostの時だけ表示しないようにする。
chrome://flags/#allow-insecure-localhost アドレスバーに入力する。

DISABLED => ENABLED に変更してブラウザを再起動する。

秘密鍵、公開鍵の作成

コマンドの実行は docker-laravel ディレクトリルートで行ってください。

$ mkcert -cert-file ./infra/docker/nginx/localhost.pem -key-file ./infra/docker/nginx/localhost-key.pem localhost

Gitで管理しないように .gitignore ファイルを作ります。

$ echo '*.pem' >> ./infra/docker/nginx/.gitignore

Dockerのコード書き換え

docker-compose.yml

公開ポートを80から443へ変更する。
HTTPSは、ウェルノウンポート番号として443が使われるのが一般的です。
ローカルでは他のコンテナと被らない番号であれば何でも良いです。

• https://ja.wikipedia.org/wiki/HTTPS

docker-compose.yml

services:
  web:
    ports:
      - target: 443
        published: ${WEB_PUBLISHED_PORT:-443}
        protocol: tcp
        mode: host

infra/docker/nginx/default.conf

下記のコードを追記する。

• http://nginx.org/en/docs/http/configuring_https_servers.html

infra/docker/nginx/default.conf

server {
    # listen 80;
    # listen [::]:80;
    listen 443 ssl;
    listen [::]:443 ssl;
    server_name localhost;
    ssl_certificate /etc/nginx/conf.d/localhost.pem; # サーバ証明書
    ssl_certificate_key /etc/nginx/conf.d/localhost-key.pem; # 秘密鍵

    # ... 省略
}

infra/docker/nginx/Dockerfile

下記のコードを追記する。

infra/docker/nginx/Dockerfile

COPY ./infra/docker/nginx/*.pem /etc/nginx/conf.d/

• 秘密鍵、公開鍵をコピーしてます。

Dockerイメージの作成、コンテナ再生成

コマンドの実行は docker-laravel ディレクトリルートで行ってください。

$ docker compose down
$ docker compose build web
$ docker compose up -d

このようにSSL証明書が有効化されていればokです。