芝生やDIY等のライフハックやWeb制作情報を発信するメディア

メニューを開く

【バーチャルホストにも対応】MacでSSL環境のローカルサーバを構築する方法

Web2017年12月29日

先日の記事でWindows10環境におけるXAMPPでSSL環境のローカルサーバを構築する方法をご紹介させていただきましたが、Mac OS Sierraでもチャンレジしてみました。MacではXAMPPを使わずにローカルサーバを複数立てていましたので、その延長線上として本記事では、MacでSSL環境のローカルサーバを構築する方法をご紹介させていただきます。

ローカルサーバのSSL有効化を行った環境

Macでは、以下の環境でローカルサーバのSSL有効化を行いました。

OSのバージョン Mac OS High Sierra(10.13.1)
Apacheのバージョン 2.4.27

Windowsに比べて結構大変だった

今回、Windows10で構築した環境と同様に、以下の環境をゴールとしてMacでSSL環境を構築しました。

  • バーチャルホストでSSL
  • オレオレ証明書で発生する警告エラーを回避
  • XAMPPもMAMPも使わず、デフォルトのApacheで対応

上記を実現するにあたってなかなかこれに合致する手順を紹介している記事はネット上に見つからず、困難を極めました。実現できたあとに手順を整理してみたらそこまで大変なものではなかったのですが、やり方を調べるのにめちゃくちゃ時間かかりましたね。。。主に以下のページを参考に色々試し、無事にやりたかったことが実現できました。先人に感謝です。

繰り返しになりますが、このあとご紹介する手順の前に、以下の記事の手順で複数のローカルサーバを作れるようにしておく必要があります。

MacでSSL環境のローカルサーバを構築する手順

複数のローカルサーバを立てられるようにできたら、以下の手順でSSL環境の構築を行います。今回、「ssl」というドメインネームで、「https://ssl/」というローカルサーバを見れるようにします。

  1. apache2にSSL証明書を格納するフォルダを作成
  2. オレオレSSL証明書の作成
  3. httpd.confの編集
  4. httpd-ssl.confの編集
  5. httpd-vhosts.confでバーチャルホストを追加
  6. hostsファイルを編集
  7. /Users/ユーザ名/Sites/ssl/index.htmlを用意
  8. Apacheを再起動
  9. ローカルサーバを開く

①apache2にSSL証明書を格納するフォルダを作成

ターミナルで以下のコマンドを叩いて、/etc/apache2/ssl/というフォルダを作成しておきます。

sudo mkdir /etc/apache2/ssl

②オレオレSSL証明書の作成

ターミナルで以下のコマンドを実行し、ローカルのみで使えるオレオレSSL証明書(自分専用のローカルのみで使える証明書)を作成します。

sudo openssl genrsa -out /etc/apache2/ssl/ssl.key 2048
sudo openssl req -new -x509 -key /etc/apache2/ssl/ssl.key -out /etc/apache2/ssl/ssl.crt -days 3650 -subj /CN=localhost
sudo security add-trusted-cert -d -r trustRoot -k /Library/Keychains/System.keychain /etc/apache2/ssl/ssl.crt

上記のコマンドを全て実行すると、以下のファイルが作成されていると思います。

  • /etc/apache2/ssl/ssl.crt
  • /etc/apache2/ssl/ssl.key

③httpd.confの編集

/etc/apache2/httpd.confを編集します。
デフォルトのApacheでは、SSLに必要ないくつかのモジュールはコメントアウトされているため、以下の3箇所に変更を加えます。

#LoadModule socache_shmcb_module libexec/apache2/mod_socache_shmcb.so
LoadModule socache_shmcb_module libexec/apache2/mod_socache_shmcb.so
#LoadModule ssl_module libexec/apache2/mod_ssl.so
LoadModule ssl_module libexec/apache2/mod_ssl.so
#Include /private/etc/apache2/extra/httpd-ssl.conf
Include /private/etc/apache2/extra/httpd-ssl.conf

④httpd-ssl.confの編集

/etc/apache2/extra/hhttpd-ssl.confを編集します。
SSL証明書と秘密鍵の読み込みパスをそれぞれ、以下のように変更します。

  • 144行目と154行目あたり
SSLCertificateFile "/private/etc/apache2/server.crt"
SSLCertificateFile "/private/etc/apache2/ssl/ssl.crt"
SSLCertificateKeyFile "/private/etc/apache2/server.key"
SLCertificateKeyFile "/private/etc/apache2/ssl/ssl.key"

⑤httpd-vhosts.confでバーチャルホストを追加

バーチャルホスト「ssl」を設定します。/etc/apache2/extra/httpd-vhosts.confをエディタで開いて、一番下に以下の記述を加えます。

<VirtualHost *:443>
ServerName ssl
DocumentRoot "/Users/ユーザ名/Sites/ssl"
SSLEngine on
SSLCipherSuite ALL:!ADH:!EXPORT56:RC4+RSA:+HIGH:+MEDIUM:+LOW:+SSLv2:+EXP:+eNULL
SSLCertificateFile /etc/apache2/ssl/ssl.crt
SSLCertificateKeyFile /etc/apache2/ssl/ssl.key
<Directory "/Users/ユーザ名/Sites/ssl">
Options Indexes FollowSymLinks
AllowOverride All
Order allow,deny
Allow from all
Require all granted
</Directory>
</VirtualHost>

⑥hostsファイルを編集

以下の記述を書き加えます。

127.0.0.1 ssl
::1 ssl

⑦/Users/ユーザ名/Sites/ssl/index.htmlを用意

確認用として、適当なindex.htmlを/Users/ユーザ名/Sites/ssl/直下に格納しておきます。

<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>ssl</title>
</head>
<body>ssl</body>
</html>

⑧Apacheを再起動

ターミナルで以下のコマンドを叩いて、Apacheを再起動します。

sudo apachectl restart

⑨ローカルサーバを開く

ここではChromeで開いた場合となります。「https://ssl/」にアクセスし、セキュリティ警告画面が表示されたら「詳細設定」をクリックします。

続けて、「sslにアクセスする(安全ではありません)」をクリックします。

ローカルサーバが表示されれば成功です。

セキュリティ警告が出ないよう「保護された通信」とする方法

ここまでの手順でSSL環境のローカルサーバは構築できますが、見ての通り信頼されていない証明書なので「保護されていない通信」と表示されています。

さらに以下の手順で信頼された証明書を作成することで、「保護された通信」のローカルサーバとすることが可能です。

理解できない箇所があっても、以下の手順通りにやれば大丈夫です。

  1. コマンドで作成したSSL証明書を削除
  2. キーチェーンアクセスでSSLサーバ証明書を作成
  3. 信頼する証明書として設定
  4. 証明書と秘密鍵を生成
  5. 証明書と秘密鍵のファイル形式を変更
  6. 証明書と秘密鍵を/private/etc/apache2/ssl/直下に格納
  7. Apacheを再起動
  8. ローカルサーバを開く

①コマンドで作成したSSL証明書を削除

先ほどコマンドで作成した、以下のオレオレ証明書を削除します。

  • /etc/apache2/ssl/ssl.crt
  • /etc/apache2/ssl/ssl.key

②キーチェーンアクセスでSSLサーバ証明書を作成

先ほどのようにコマンドではなく、Macのアプリ「キーチェーンアクセス」で証明書の作成を行います。アプリケーションの「ユーティリティ」内にある「キーチェーンアクセス」を起動し、メニューバーから[証明書アシスタント]-[証明書を作成]をクリックします。

ここでは名前は「ssl」としました。固有名のタイプは「自己署名ルート」、証明書のタイプは「SSLサーバ」とし、「デフォルトを無効化」にチェックを入れた状態で、「続ける」をクリックします。

「続ける」をクリックします。

シリアル番号と有効期間はそのまま編集せず、「続ける」をクリックします。

証明書の個人情報を入力します。今回ローカルでのみ使うのでほとんど適当でOKです。名前だけ「ssl」としました。入力したら「続ける」をクリックします。

鍵ペア情報で設定する「鍵のサイズ」「アルゴリズム」はデフォルトのまま、「続ける」をクリックします。

鍵用途拡張領域は「署名」「鍵の暗号化」にチェックを入れ、「続ける」をクリックします。

拡張鍵用途拡張領域は「SSLサーバ認証」にチェックを入れ、「続ける」をクリックします。

基本制約拡張領域は何もチェックせず、「続ける」をクリックします。

サブジェクト代替名拡張領域は、dNSNameに今回設定するローカルサーバ「ssl」を入力し、iPAdressには「127.0.0.1」を入力し、「続ける」をクリックします。

証明書を保管するキーチェーンを指定します。「ログイン」を選択し、「作成」をクリックします。

これで証明書が作成されました。「完了」をクリックします。

③信頼する証明書として設定

次に、作成した証明書を信頼する証明書として設定します。

キーチェーン「ログイン」、分類「全ての項目」から先ほど作成した証明書を見つけます。

右クリックから「情報を見る」をクリックします。

「この証明書を使用するとき」を「常に信頼」に変更します。これでブラウザがこの証明書を信頼できるものと判断するようになります。

④証明書と秘密鍵を生成

次に、証明書と秘密鍵を生成します。先ほどの証明書にて右クリックから「"ssl"を書き出す」をクリックします。

名前は「ssl」とし、場所はぼかしを入れていますがホームディレクトリを指定しました。フォーマットは「証明書(.cer)」とし、「保存」をクリックします。

続けて秘密鍵を書き出します。秘密鍵にて右クリックから「"ssl"を書き出す」をクリックします。

名前は「ssl」とし、先ほどと同様ホームディレクトリに生成します。フォーマットは「個人情報交換(.p12)」とし、「保存」をクリックします。

⑤証明書と秘密鍵のファイル形式を変更

ターミナルで以下のコマンドを叩き、証明書と秘密鍵をApacheで使える形式に変更します。まずは以下のコマンドでホームディレクトリに移動します。

cd /Users/ユーザ名/

続けて、以下のコマンドで証明書のエンコーディング形式をDERからPEMに変更し、拡張子を「.cer」から「.crt」に変更します。

openssl x509 -in ssl.cer -inform DER -out ssl.crt -outform PEM

続けて、以下のコマンドでssl.p12から秘密鍵を取り出したssl.keyを作成します。

openssl pkcs12 -in ssl.p12 -nocerts -nodes -out ssl.key

これで、ホームディレクトリ直下に「ssl.crt」「ssl.key」が生成されています。

⑥証明書と秘密鍵を/private/etc/apache2/ssl/直下に格納

ホームディレクトリ直下に生成された「ssl.crt」と「ssl.key」を「/etc/apache2/ssl/」直下に移動させます。

⑦Apacheを再起動

ターミナルで以下のコマンドを叩いて、Apacheを再起動します。

sudo apachectl restart

⑧ローカルサーバを開く

「https://ssl/」にアクセスし、「保護された通信」と表示されていれば成功です。

Firefoxでは相変わらず警告が出る

Windowsでもそうなんですが、MacもここまでやったとしてもFirefoxでは相変わらず警告が表示されるので、FirefoxでSSLのローカルサーバを表示する場合はブラウザ上で例外認証する必要があります。

まとめ

httpd.confでモジュールをインクルードしたらApache自体が起動しなくなったり「保護された通信」とするやり方がわからなかったり、結構つまづきポイントがありました。

このあたりのMacの情報はあまり多くないこともあって、Windowsに比べてMacでローカルサーバのSSL環境を構築するのはかなり苦労しました。

今後世の中が常時SSL化への動きを加速させていくことは間違いないので、MacでもローカルでSSL環境を構築しておけば検証が捗りますね。万が一SSLのテスト環境が用意できない場合はなおさら重宝するんじゃないかと思います。

MacでローカルサーバでSSL環境を構築される際は、本記事がご参考になれば幸いです。

この記事を読んでいる方にオススメの記事

「Web」の他の記事を読む

この記事にコメントする

必須
必須
本文必須

  • 承認制のため、即時には反映されません。

ページの先頭に戻る