MAMPでSSLを使えるようにする際の設定

1.あらかじめ以下の場所にSSL自己証明書のファイルを置くためのフォルダを作っておく。今回はフォルダ名をkeysとします。
[crayon]MAMP/conf/apache/keys[/crayon]

2.ターミナルを立ち上げ、自己証明書に関するファイルを生成していきます。

2-1.ディレクトリの移動
[crayon]cd /Applications/MAMP/conf/apache/keys[/crayon]

2-2.1024ビット鍵を生成
[crayon]openssl genrsa -des3 -out server.key 1024[/crayon]

※パスフレーズの入力あり

2-3.CSRを作成。
[crayon]openssl req -new -key server.key -out server.csr[/crayon]
以下の項目を聞かれるので順に入力していく(下は自分の場合の入力例)
[crayon]Country Name (2 letter code) [AU]: 国名(例JP)
State or Province Name (full name) [Some-State]: 県名(例Tokyo)
Locality Name (eg, city) []:市区町村(例Shibuya-ku)
Organization Name (eg, company) [Internet Widgits Pty Ltd]: 組織名(例localhost)
Organizational Unit Name (eg, section) []: 部署名(例省略)
Common Name (eg, YOUR name) []: コモンネーム(例localhost)
Email Address []: メールアドレス(例admin@localhost)

Please enter the following ‘extra’ attributes
to be sent with your certificate request
A challenge password []: 省略
An optional company name []: 省略[/crayon]

2-4.365日間有効の証明書を発行(期限が切れても開発に利用するだけなら問題なし)
[crayon]openssl x509 -in server.csr -days 365 -req -signkey server.key > server.crt[/crayon]

以上で今回必要なファイルは揃うが、実際mampにインストールしてパスフレーズに関してエラーが出たりしたので、パスフレーズを省略する設定もしておきます。
[crayon]cp server.key server.key.bak
openssl rsa -in server.key.bak -out server.key[/crayon]
ちなみに自宅サーバーを公開とかなるべく運用サーバーに近い環境にしたければコモンネームなど任意のドメインにしてもいいけど、開発だけならlocalhostとしとけばいいと思います。

keysにファイルが出来上がった状態

3.MAMPへのssl証明書の設定

3-1.apacheのポートは80に設定(あとでも先でもいい)
httpd.confのServerName localhost:80とするか、
mampを立ち上げ環境設定から

ポートを80に設定

3-2.MAMP/conf/apache/httpd.confを開く

自分のだとファイルの末尾の方に
[crayon]# Secure (SSL/TLS) connections
#Include /Applications/MAMP/conf/apache/extra/httpd-ssl.conf[/crayon]

「#」を外してhttpd-ssl.confを読み込むようにする
[crayon]# Secure (SSL/TLS) connections
Include /Applications/MAMP/conf/apache/extra/httpd-ssl.conf[/crayon]

今回はhttps://www.example.comでのアクセスも試みるので、バーチャルホストの設定を読み込ませる
[crayon]# Virtual hosts
#Include /Applications/MAMP/conf/apache/extra/httpd-vhosts.conf[/crayon]

「#」を外してhttpd-vhosts.confを読み込むようにする
[crayon]# Virtual hosts
Include /Applications/MAMP/conf/apache/extra/httpd-vhosts.conf[/crayon]

3-3.MAMP/conf/apache/extra/httpd-ssl.confを開く

設定するところは以下の箇所

https://www.example.comのサイトにアクセスできるようにする場合がデフォルトになっているので、hostsファイルの設定ができているならwww.exampleの部分を任意のドメインに変更すればいい。

##デフォルト
[crayon]
#この部分を修正

# General setup for the virtual host
DocumentRoot “/Applications/MAMP/Library/htdocs” ←この部分を/Applications/MAMP/htdocsに変更した
ServerName www.example.com:443
ServerAdmin you@example.com
ErrorLog　”/Applications/MAMP/Library/logs/error_log”
TransferLog “/Applications/MAMP/Library/logs/access_log”[/crayon]

##修正後
[crayon]

# General setup for the virtual host
DocumentRoot “/Applications/MAMP/htdocs”
ServerName www.example.com:443
ServerAdmin you@example.com
ErrorLog　”/Applications/MAMP/Library/logs/error_log”
TransferLog “/Applications/MAMP/Library/logs/access_log”[/crayon]

##デフォルト
[crayon]SSLCertificateFile “/Applications/MAMP/conf/apache/server.crt”[/crayon]
##修正後
[crayon]SSLCertificateFile “/Applications/MAMP/conf/apache/keys/server.crt”[/crayon]

##デフォルト
[crayon]SSLCertificateKeyFile “/Applications/MAMP/conf/apache/server.key”[/crayon]
##修正後
[crayon]SSLCertificateKeyFile “/Applications/MAMP/conf/apache/keys/server.key”[/crayon]

3-4.MAMP/conf/apache/extra/httpd-vhosts.confを開く
#mampの環境設定でapacheのポートを80にすでに設定している前提
NameVirtualHost *:80
の行の直下に以下を追記(最初のlocalhostに関する<VirtualHost *:80>~</VirtualHost>の部分は入れておく方がベター)。

[crayon]
ServerAdmin admin@localhost
DocumentRoot “/Applications/MAMP/htdocs”
ServerName localhost
ErrorLog “logs/localhost-error_log”
CustomLog “logs/localhost-access_log” common
ServerAdmin admin@www.example.com
DocumentRoot “/Applications/MAMP/htdocs”
ServerName www.example.com
ErrorLog “logs/www.example.com-error_log”
CustomLog “logs/www.example.com-access_log” common
[/crayon]

4-1.htdocsに確認用のindex.htmlを配置。

https://www.example.comアクセスしてみる(hostsファイルは設定済み)

最初次のようなアラートが出るけど”続行”をクリック

httpsでアクセスできるようになっている。https://localhost入力した結果も同じ。

wordpressなどでssl環境での開発環境が必要な場合もまずはhello worldを表示させてから取り組む方がミスが少ない。

一度設定してしまえば後はexample.comのを任意のドメインに、htdocs以下のドキュメントルートを正確に設定しておけば使い回せる。

このページ長かったので誤字脱字がないかちょっと不安;