XAMPPのバーチャルドメインをSSL化する方法
準備
ドメイン
XAMPPで「https://woocommerce2.com」を表示可能にすることが目標です。
環境
- Windows 10
- XAMPP 7.3.10
バーチャルドメインとXAMPPの設定
PHPでOpenSSLを有効にする
初期状態では有効になっていないと思いますので、確認も兼ねて対象ファイルを開きましょう。
C:\xampp\php\php.iniないの以下のコードのように編集
;extension=php_openssl.dll ↓コメントアウトを削除 extension=php_openssl.dll
ApacheのSSL関連の設定を追加する
C:\xampp\apache\conf\extra\httpd-ssl.confの末尾に下記を追加します。
※自分の場合は、wp-woocommerceの中にwordpressを作成し、そこに専用のドメインを割り当てるという作業を行っています。
<VirtualHost *:443> DocumentRoot "C:/xampp/htdocs/wp-woocommerce" ServerName woocommerce2.com SSLEngine on SSLCertificateFile "conf/ssl.crt/my-server.crt" SSLCertificateKeyFile "conf/ssl.key/my-server.key" </VirtualHost>
hostsファイルを設定
C:\Windows\System32\drivers\etc\hostsファイルを開きます。
hostsファイルについて
hostsファイルは、管理者として編集を行う必要があります。
メモ帳やテキストエディタを右クリックし、『管理者として実行』を選択すると編集できます。
詳しくは『hostsファイル編集』で検索するとよいでしょう
ファイルを開いたら、最終行に以下を追加。
127.0.0.1 localhost 127.0.0.1 woocommerce2.com
動作確認
XAMPPのコントロールパネルからApacheを再起動したら
https://woocommerce2.comにアクセス。
現段階ではSSLの設定が完了していないので、以下のようなエラーページが表示されますが、気にしないでください。
証明書取得と設定
古い証明書の削除
認証されなくなった古い証明書がある場合は削除します。
- Chromeの設定>プライバシーとセキュリティを開き、「証明書の管理」のリンクをクリック
- 信頼されたルート証明機関からlocalhostを削除
上の画像の黄色に塗ってあるところをクリックしていくと削除できます。
削除の際に、確認アラートが出ますが、気にせずに削除しましょう。
OpenSSL設定ファイルを編集
- C:\xampp\apache\conf\openssl.cnfを複製し、ファイル名をopenssl-san.cnfに変更
- ファイルを開き、以下を末尾に追記
[ SAN ] subjectAltName = @alt_names [ alt_names ] DNS.1 = localhost DNS.2 = woocommerce2.com DNS.3 = <他に認証したいドメインがあれば>
SSLサーバ証明書を作成
- Git Bashをインストール
- Git Bashを立ち上げ、以下のコードを実行
# C:\xampp\apache\conf へ移動 $ cd /c/xampp/apache/conf # my-server.crt, my-server.key 2ファイルを生成 $ 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
上の画像を参考にすると上手くできます。
入力する際は$はすでに入力されているので気を付けましょう。
証明書ファイルを移動して設置
コマンドが成功するとC:\xampp\apache\conf\ディレクトリにファイルが出来上がるので、そのファイルをそれぞれのディレクトリに移動します。
ファイル | 設置場所 |
---|---|
my-server.crt | C:\xampp\apache\conf\ssl.crt |
my-server.key | C:\xampp\apache\conf\ssl.key |
証明書を認証
- C:\xampp\apache\conf\ssl.crt\my-server.crtをダブルクリック
- 証明書のウインドウが開いたら「証明書のインストール」をクリック
- 保存場所を現在のユーザーを選択し「次へ」をクリック
- 証明書をすべて次のストアに配置するを選択し「参照」をクリック
- ウインドウが開いたら信頼されたルート証明機関を選択し「OK」をクリックしてウインドウを閉じる
- 「次へ」をクリック
- 「完了」をクリックしてインポート
- アラートがでたら「はい」をクリック
- 正しくインポートされました。とアラートがでたら完了
動作確認
XAMPPのコントロールパネルからApacheを再起動したら
https://woocommerce2.comにアクセス。
先程のようなエラー画面が表示されなければ無事にSSL化が完了です。
失敗した場合は、もう一度手順をゼロから行ってみましょう。
参考サイト
XAMPP for WindowsでSSLを有効にする – Qiita
Git Bashって使ってる?Windowsで動く意外にすごい便利ツール | 侍エンジニア塾ブログ