49
60

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

ローカル環境用SSLサーバ証明書を簡単に発行する(mkcert)

Posted at

ローカル環境でSSLを使ったWebアプリを開発する際
サーバ証明書として自己署名証明書(いわゆるオレオレ証明書)を作成して使用したりしますが
手順が複雑だったり、ブラウザでアクセスした際に
信頼できない証明書として警告画面が表示される場合があります

mkcert は簡単なコマンドで
ローカル環境に認証局を登録し、サーバ証明書の発行を行ってくれるツールです

インストール

macOS (Homebrewを利用)

$ brew install mkcert

Firefoxを利用する場合

$ brew install nss

Windows (Chocolateyを利用)

> choco install mkcert

Firefoxを利用する場合

  1. mkcert -CAROOTコマンドを実行してCA証明書格納ディレクトリを調べる
  2. オプション→プライバシーとセキュリティ→証明書を表示
  3. 認証局証明書→インポート
  4. 1のパスにあるrootCA.pemを選択

CA証明書をインストール (初回のみ)

$ mkcert --install

サーバ証明書を発行

$ mkcert localhost
$ mkcert localhost *.localhost example.com *.example.com

証明書ファイルと秘密鍵ファイルの出力先を指定する

$ mkcert -cert-file 証明書ファイル -key-file 秘密鍵ファイルのパス localhost

Docker(nginxコンテナ)で使ってみる

ローカルDocker環境でnginxを起動しmkcertで作成した証明書を使って
SSLページを表示する例です

  • 証明書の作成
$ mkdir certs
$ mkcert -cert-file ./certs/localhost.crt.pem -key-file ./certs/localhost.key.pem localhost
  • nginxの設定ファイルを作成
$ mkdir conf
$ vi conf/default.conf
conf/default.conf
server {
    listen       443 ssl http2;
    server_name  localhost;

    # https://nginx.org/en/docs/http/ngx_http_ssl_module.html
    ssl_certificate     /etc/ssl/certs/localhost.crt.pem;
    ssl_certificate_key /etc/ssl/certs/localhost.key.pem;

    location / {
        root   /usr/share/nginx/html;
        index  index.html index.htm;
    }
}
  • docker-compose.yml の作成
$ vi docker-compose.yml
docker-compose.yml
version: '3.7'

services:
  nginx:
    container_name: 'nginx'
    image: 'nginx:latest'
    volumes:
      - './conf:/etc/nginx/conf.d'
      - './certs:/etc/ssl/certs'
    ports:
      - '443:443'
  • Dockerの起動
$ docker-compose up -d
  • https://localhost/ をブラウザで開いてみる
    「Welcome to nginx!」のページが表示されれば成功です
49
60
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
49
60

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?