【XAMMP】バーチャルホスト + SSL証明書を有効にする <Windows>

ローカルでささっと確認するのにXAMPPを使っているのですが、テストしたりするのにXAMPP環境もSSL化しておかないとなっていうことで、調べながら対応させたのでメモ。

目的

https://site01/
https://site02/
でアクセスできるようにする。
環境:Windows7、Google Chrome
 

1.バーチャルホストの設定

1.php.iniファイルを確認

extension=php_openssl.dllがコメントアウトされていないか確認
xamppをC直下にインストールした場合は以下のパス
C:\xampp\php\php.ini
デフォルトではされていないもよう。

;extension=php_openssl.dll
↓
extension=php_openssl.dll

頭に ; がついていたら削除
 

2.httpd-ssl.confの編集

以下のファイルに追記
C:\xampp\apache\conf\extra\httpd-ssl.conf

<VirtualHost *:443>
    ServerName site01
    DocumentRoot "C:/xampp/htdocs/site01"
    SSLEngine on
    SSLCertificateFile "conf/ssl.crt/server.crt"
    SSLCertificateKeyFile "conf/ssl.key/server.key"
</VirtualHost>

<VirtualHost *:443>
    ServerName site02
    DocumentRoot "C:/xampp/htdocs/site02"
    SSLEngine on
    SSLCertificateFile "conf/ssl.crt/server.crt"
    SSLCertificateKeyFile "conf/ssl.key/server.key"
</VirtualHost>

DocumentRootにはルートディレクトリのパスを指定。

SSLCertificateFile "conf/ssl.crt/server.crt"
SSLCertificateKeyFile "conf/ssl.key/server.key"
のパスはバージョンによってか変わるみたいなので、httpd-ssl.conf内でSSLCertificateFileSSLCertificateKeyFileで検索して同じパスを設定しておく。
 

2.hostsファイルの編集

hostsファイル追記します。通常以下のパスにあります。
C:\Windows\System32\drivers\etc\hosts
一番最後に以下を追記します。

127.0.0.1 site01
127.0.0.1 site02

保存したらApatcheを再起動してブラウザで一旦確認。
https://site01/でブラウザでアクセスしてみます。

f:id:annykyon:20180322131603p:plain

こんな感じで警告が表示されますが、site01にアクセスする(安全ではありません)からとりあえず無理やり表示。
アドレスバーに以下のように警告が表示されますが、ひとまずバーチャルホストの設定はOK。

f:id:annykyon:20180329132100p:plain
 

2.SSL証明書の発行と設置

1.OpenSSL設定ファイルを編集する

C:\xampp\apache\conf\openssl.cnfをコピーして、openssl-san.cnfにリネーム。
一番下に以下を追記します。

[ SAN ]
subjectAltName = @alt_names

[ alt_names ]
DNS.1 = localhost
DNS.2 = site01
DNS.3 = site02

 

2.サーバ証明書、秘密鍵の作成

Git Bashなら、そのままopensslコマンドを使えるということなので、Git Bahを使いました。

# ディレクトリ移動
$ cd /c/xampp/apache/conf

# サーバ証明書、秘密鍵を生成
$ openssl req \
> -newkey  rsa:4096 \
>  -keyout  my-server.key \
> -x509 \
>  -nodes \
> -out my-server.crt \
> -subj  "//CN=localhost" \
> -reqexts  SAN \
> -extensions  SAN \
> -config  openssl-san.cnf \
> -days  3650
Generating a 4096 bit RSA private key
.............................................................................................................................++
...............................................................++
writing new private key to 'server.key'
-----

これで $C:\xampp\apache\confに、 my-server.crt my-server.key ができました。

このファイルをそれぞれ以下のディレクトリに移動します。
my-server.crtC:\xampp\apache\conf\ssl.crt\
my-server.keyC:\xampp\apache\conf\ssl.key\

 

3.サーバ証明書、秘密鍵のパスを変更

C:\xampp\apache\conf\extra\httpd-ssl.conf のサーバー証明書と秘密鍵のパスを作成したファイル名に書き換えます。

<VirtualHost *:443>
    ServerName site01
    DocumentRoot "C:/xampp/htdocs/site01"
    SSLEngine on
#server.crtをmy-server.crtにserver.keyをmy-server.keyに書き換え
    SSLCertificateFile "conf/ssl.crt/my-server.crt"
    SSLCertificateKeyFile "conf/ssl.key/my-server.key"
</VirtualHost>

<VirtualHost *:443>
    ServerName site02
    DocumentRoot "C:/xampp/htdocs/site02"
    SSLEngine on
    SSLCertificateFile "conf/ssl.crt/my-server.crt"
    SSLCertificateKeyFile "conf/ssl.key/my-server.key"
</VirtualHost>

 

4.証明書のインストール

1.C:\xampp\apache\conf\ssl.crt\my-server.crt をダブルクリックし、証明書ウィンドウが開いたら証明書のインストールを選択。

f:id:annykyon:20180329150752p:plain

2.証明書をすべて次のストアに配置するを選択。
3.参照ボタンをクリックし、信頼されたルート証明機関を選択し次へをクリック。
4.セキュリティ警告がでますが、はいを選択

以上で、証明書がインストールされました。

 

5.確認

apacheを再起動し、 https://site01/ でアクセスしてみます。
アドレスバーが保護された通信になっていたら成功です。

f:id:annykyon:20180329151951p:plain

 

参考記事

XAMPP for WindowsでSSLを有効にする - Qiita

opensslでマルチドメイン証明書用のCSRを作成