ローカル環境で SSL を有効にする（for XAMPP）

Google Chrome が、非SSLのWebサイトに対して警告を表示するようになりました。

今ではセキュリティ確保の点からWebサイトに常時SSLが求められるようになっています。

サイト全体を HTTPS で接続できるようにするのが、現在のトレンドです。

それに伴い、ローカル環境（Windows for XAMPP）でもSSLの環境が必須になってきました。

今回は、ローカル環境でSSLを有効にする内容をエントリーします。

 

現状

バーチャルホストで設定しています。

 
httpd.conf

C:\xampp\apache\conf\httpd.conf の末尾に追記

：
<VirtualHost *:80>
DocumentRoot "C:/xampp/htdocs/ssl/public
ServerName dev.ssl
</VirtualHost>

 
hosts

C:\Windows\System32\drivers\etc\hosts の末尾に追記

：
127.0.0.1 dev.ssl

 
ブラウザでビュー

 

課題

URLの先頭（スキーム）に https:// と入力。

するとXAMPPのダッシュボードにリダイレクトされてしまう。

これを回避するために以下の作業を行います。

 

手順

 

１）php.ini の設定

C:\xampp\php\php.ini にある OpenSSL を有効にします。（※デフォルトでは有効になっています）

// ;extension=php_openssl.dll
extension=php_openssl.dll

コメントアウトされていないことを確認します。

 

２）httpd-ssl.conf の設定

ApacheのSSL関連の設定を追加します。

C:\xampp\apache\conf\extra\httpd-ssl.conf の末尾に追加。

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

dev-ssl.crt と dev-ssl.key はこの後に作成します。

 

３）OpenSSL設定ファイルを編集

１．C:\xampp\apache\conf\opnessl.cnf をコピー
２．ファイル名を openssl-san.cnf に変更
３．以下を末尾に追加

[ SAN ]
subjectAltName = @alt_names

[ alt_names ]
DNS.1 = dev.ssl

 

４）SSLサーバ証明書を作成

Git Bash で openssl コマンドを使います。

Git Bash のインストール（git for windows）

# C:\xampp\apache\conf へ移動
$ cd /c/xampp/apache/conf

# dev-ssl.crt(サーバ証明書), dev-ssl.key(秘密鍵) の2つのファイルを生成
$ openssl req \
-newkey rsa:4096 \
-keyout dev-ssl.key \   # 秘密鍵
-x509 \
-nodes \
-out dev-ssl.crt \      # サーバ証明書
-subj "//CN=dev.ssl" \  # サーバ名
-reqexts SAN \
-extensions SAN \
-config openssl-san.cnf \
-days 3650

 
実際に打つとこんな感じになります。

 

５）証明書を設置

上記のコマンドを実行すると C:\xampp\apache\conf に dev-ssl.crt と dev-ssl.key が生成されます。

dev-ssl.crt を C:\xampp\apache\conf\ssl.crt に設置。

dev-ssl.key を C:\xampp\apache\conf\ssl.key に設置。

 

６）証明書を認証

１．C:\xampp\apache\conf\ssl.crt\dev-ssl.crt をダブルクリック

２．「証明書のインストール」をクリック

３．保存場所を「現在のユーザー」を選択して「次へ」

４．「信頼されたルート証明機関」を選んで「次へ」

このあと、「証明書のインポートウィザードの完了」画面が表示されます。

「完了」をクリックして証明書をインポートしてください。

 

７）動作確認

XAMPPのApacheを再起動して、https://dev.ssl へアクセス

上記のように表示されれば OK です。

 

応用編

複数のドメインにSSLをかける場合は？

例）https://dev.ssl2 も可能にする場合

 

１．httpd-ssl.conf に二か所記述します。

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

<VirtualHost *:443>
DocumentRoot "C:/xampp/htdocs/ssl2/public"
ServerName dev.ssl2
SSLEngine on
SSLCertificateFile "conf/ssl.crt/dev-ssl2.crt"
SSLCertificateKeyFile "conf/ssl.key/dev-ssl2.key"
</VirtualHost>

 

２．openssl-san.cnf にも追記

[ SAN ]
subjectAltName = @alt_names

[ alt_names ]
DNS.1 = dev.ssl
DNS.2 = dev.ssl2

 

３．SSLサーバ証明書を作成

http://dev.ss2 用にSSLサーバ証明書を作成します。

あとは同様の手順で「証明書を設置」⇒　「証明書を認証」の手順を踏みます。

 
以上です。

 

-環境構築