みなさんローカル環境での開発時は必要に応じて「自己署名入り証明書」（通称：オレオレ証明書）を作成していると思います。
ほとんどは主にopensslなどを使って作成していたりすると思いますが、オプションが複雑で毎回ググったり、そもそもopensslのバージョンの問題などでコマンドがコケることもしばしばあるのではないでしょうか。僕だけですかね（苦笑）
日頃からサーバーサイドのことをやっているわけではないので結構ストレスを感じながらやっていましたが、今回ServiceWorkerをいろいろ検証（「Workbox + webpackでServiceWorkerのオフラインキャッシュと戯れる」、「ServiceWorkerのキャッシュ戦略を考える」を参照）するにあたって調べたところmkcertというツールを発見。使ってみてものすごく簡単だったのでオススメしたいと思います。
インストール
それではインストールしていきましょう。
環境を汚したくないので、homebrewからインストールが可能な点はかなり嬉しい。
brew install mkcert次にローカル環境に認証局を作成します。
mkcert -installSSL証明書を発行
以下のコマンドで任意のドメインでSSL証明書が作成できます。
簡単ですね。
mkcert sample.co.jp複数ドメインを設定できるうえにワイルドカードもいけるみたいです！
僕は主にBaseStationというサービスを開発しているのですが、ローカル環境用に“xxxxx.bst.co.jp”というドメインを使っているので、使い回しできるようにワイルドカードで使える証明書を作成しました。ワイルドカードを指定する場合、ダブルクォーテーション（“”）で囲む必要があるようです。
念のためbst.co.jp、localhostとローカルのIPアドレスも入れておきます。
mkcert "*.bst.co.jp" bst.co.jp localhost 127.0.0.1カレントディレクトリに証明書が生成されました。
- _wildcard.bst.co.jp+3-key.pem
- _wildcard.bst.co.jp+3.pem
ファイル名は先頭に指定したドメイン名と”+3″はその他3つのドメインが指定されているという意味と思われます。
SSL証明書を設置
あとはこのファイルをWEBサーバーに設置しましょう。
以下はnginxでの例ですが、設定ファイルの” “ssl_certificate”と“ssl_certificate_key”にてファイルを設置したディレクトリを指定します。
server {
listen 443 ssl http2;
server_name sample.bst.co.jp;
ssl on;
ssl_certificate /etc/nginx/ssl/_wildcard.bst.co.jp+3.pem;
ssl_certificate_key /etc/nginx/ssl/_wildcard.bst.co.jp+3-key.pem;
ssl_protocols SSLv3 TLSv1 TLSv1.1 TLSv1.2;
}Dockerの場合
弊社ではDockerを使っているので、docker-compose.ymlのvolumesに指定して、起動時に設置されるようにします。
certsディレクトリを作成してここに先ほど作成したSSL証明書ファイル一式を配置しています。
version: '3'
services:
nginx:
// imageの指定など
volumes:
- ./certs:/etc/nginx/ssl
- ./conf/default.conf:/etc/nginx/conf.d/default.conf起動してみてファイルがあるかどうかを確認します。
docker execコマンドで起動中のコンテナにログインして確認します。
指定したディレクトリにファイルが設置されています。
ブラウザで確認
ブラウザでローカル環境のドメインに接続してみます。
感想
昨今の開発では、https通信でないと正常に動作しないケースが増えてきています。
ただでさえ新しい技術スタックのインプットに時間はあればあるだけよいという状況と思いますので、環境セットアップに貴重な時間を奪われたくない方々の一助となれば幸いです。
