MENU
  1. ホーム
  2. ローカル環境
  3. XAMPP
  4. XAMPPでHTTPSアクセスを可能にする方法

XAMPPでHTTPSアクセスを可能にする方法

ローカル環境 XAMPP
当ページのリンクには広告が含まれています。

XAMPPは、デフォルトでは「https://」によるアクセスはできません。ローカルPCでの制作・開発作業では、通常はそれでも大丈夫なのですが、動作検証をしたい場合など、まれに「https://」でアクセスしたい場合があったりします。

この記事では、XAMPPで動作しているウェブ・サイトやシステムに、「https://」でアクセス可能とする手順を説明します。

この記事の実行環境
  • Windows11 Home (23H2)
  • XAMPP 8.2.12
  • テキストエディタ : VSCode
目次

前提

手順の前提となる2つのことについて、説明します。

「openssl」の使用について

パソコン上のローカルサイトであっても、ブラウザから「https」アクセスを可能とするためには、「サーバー証明書」が必要になります。

手順の途中で「opensslコマンド」を使用して、サーバー証明書の作成を行いますが、Windowsのコマンドでは「opensslコマンド」は使用することができません。

そのため、この手順では「Git」をインストールすると使用できるようになる「Git Bash」を使用して「opensslコマンド」を実行しています。

「Git Bash」は「Git」をインストールすると、一緒にインストールされます。必要な場合は以下の記事を参考にして、「Git」をインストールしてください。

Gitをインストールする手順

https化するURLについて

今回は、例として、以下の2つのURLを「https」でアクセスできるように設定します。

  1. http://localhost
  2. http://test1.localhost

「test1.localhost」は、バーチャルホスト機能を使用して構築しているサイトです。もし、バーチャルホストを使って構築しているサイトを「https化」したい場合に参考にしてください。

XAMPPでバーチャルホスト – 複数のドキュメントルートで複数サイトの管理を楽にする

「OpenSSL」が有効になっているか、確認

最初に、PHPの設定上「OpenSSL」が有効になっているか、確認を行います。

「C:¥xampp¥php¥php.ini」をエディタで開き、「extension=php_openssl.dll」がコメントアウトされていないことを確認してください。

「extension=php_openssl.dll」がコメントアウトされていないことを確認
「extension=php_openssl.dll」がコメントアウトされていないことを確認

“localhost”をhttps化する手順

「http://localhost」を「https化」する手順を解説します。

なお、ここからの作業では「httpd-ssl.conf」等のApacheの設定ファイルを編集します。エラー等の混乱を避けるために、XAMPPのApacheは停止して、作業を開始することをオススメします。最後に動作確認を実施しますが、それまでの間、Apacheは停止していても問題なく作業できます。

Apacheは停止
Apacheは停止

OpenSSL設定ファイルの複製と編集

「OpenSSL設定ファイル」をコピーして、専用の設定ファイルを作成します。コピー元となる「OpenSSL設定ファイル」のパスは、以下の通りです。

C:¥xampp¥apache¥conf¥openssl.cnf

今回は「openssl_localhost.cnf」という名前でコピーしました。

「openssl_localhost.cnf」という名前でコピー
「openssl_localhost.cnf」という名前でコピー

コピー先のファイル名は何でも良いのですが、今後の設定で、このファイル名を使用するので、特に問題なければ、「openssl_localhost.cnf」としてください。

コピーした「openssl_localhost.cnf」をエディタで開き、ファイルの最後に以下を追加します。

[ SAN ]
subjectAltName = @alt_names

[ alt_names ]
DNS.1 = localhost

「SAN」とは「Subject Alternative Name」の略で、ドメイン名を登録します。今回は”localhost”を「https化」しますので、1つ目の設定として「DNS.1 = localhost」を登録しています。

ApacheのSSL設定ファイルに、HTTPSアクセスの設定追加

「C:¥xampp¥apache¥conf¥extra¥httpd-ssl.conf」に、以下の内容を追加します。

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

この設定は、”localhost”に対して、443番ポートでのアクセスを設定、つまりHTTPS通信でのアクセスを設定する記述です。

サーバー証明書を作成

「opensslコマンド」を使用して、サーバー証明書を作成します。上記「前提」にも書いたとおり「opensslコマンド」は、Windowsのコマンドプロンプトでは使用できませんので、「Git Bash」を使用して作成します。

「Git Bash」を起動します。

「Git Bash」を起動

「C:/xampp/apache/conf」にCDします。

cd /c/xampp/apache/conf

以下のコマンドで「localhost」のサーバー証明書を作成します。以下の全体をコピペして実行すればOKです。

openssl req \
-newkey     rsa:2048 \
-keyout     localhost.key \
-x509 \
-nodes \
-out        localhost.crt \
-subj       "//CN=localhost" \
-reqexts    SAN \
-extensions SAN \
-config     openssl_localhost.cnf \
-days       3650

次のスクリーンショットは、CDコマンドの実行からのスクリーンショットです。

CDコマンドの実行からのスクリーンショット

作成が終了したら、”exit”コマンドで「Git Bash」を終了させます。

作成したサーバー証明書の有効期間

上記のサーバー証明書の作成コマンドでは、その有効期間に「-days 3650」を指定しています。

これは、サーバー証明書作成日から、3650日間（≒10年間）有効とする設定です。パソコンのlocalhostの証明書なので、とても長い期間、有効としています。

作成したサーバー証明書を移動

opensslコマンドで作成した証明書ファイルは「C:¥xampp¥apache¥conf」に作成されています。

今回の例では、次の2つのファイルが「C:¥xampp¥apache¥conf」に作成されているハズです。

  • C:¥xampp¥apache¥conf¥localhost.crt … サーバー証明書
  • C:¥xampp¥apache¥conf¥localhost.key … サーバー証明書に対応する暗号化キーファイル

これらのファイルを、以下のルールに従って移動します。

ルール①「.crt」ファイル

「.crt」ファイルは、フォルダ「C:¥xampp¥apache¥conf¥ssl.crt」下に移動します。

ルール②「key」ファイル

「.key」ファイルは、フォルダ「C:¥xampp¥apache¥conf¥ssl.key」に移動します。

サーバー証明書をインストール

証明書をインストールします。

「C:¥xampp¥apache¥conf¥ssl.crt¥localhost.crt」をダブルクリックします。以下の画面が表示されるので「証明書のインストール」をクリックします。

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

「保存場所」に「現在のユーザー」が選択されています。このまま「次へ」をクリックします。

「次へ」をクリック

次の画面は、ちょっと注意が必要です。以下を実施します。

  1. 「証明書をすべて次のストアに配置する」を選択します。
  2. 「参照」ボタンをクリックして、「信頼されたルート証明機関」を選択します。
証明書のインポート・ウィザード

次のスクリーンショットのようになっていることを確認して、「次へ」をクリックします。

設定を確認して「次へ」をクリック
設定を確認して「次へ」をクリック

インポート前の確認画面が表示されます。「完了」をクリックします。

「完了」をクリック

「セキュリティ警告」ダイアログが表示されます。「はい」をクリックします。

「セキュリティ警告」ダイアログ

「正しくインポートされました。」と表示されました。「OK」をクリックします。

「正しくインポートされました。」と表示されました。「OK」をクリック。

以上で「localhost」を「https化」する設定作業は完了です。

動作テスト

ブラウザから「https://localhost」でアクセスできるかどうか、テストを行います。XAMPPコントロールパネルから「Apache」を起動してください。

「Apache」を起動
「Apache」を起動

「Chrome」を使用して「https://localhost」でアクセスしてみます。

なお「localhost」ホストのドキュメントルートには、以下のような”index.php”を設置した状態で、テストをしています。

<?php
echo 'こんにちは「c:\xampp\htdocs」です。';
phpinfo();
「Chrome」を使用して「https://localhost」でアクセス

上のスクリーンショットの通り「https://」でアクセスできました。

証明書の状態を確認してみると「有効」になっています。

証明書の状態も「有効」
証明書の状態も「有効」

「https://localhost」で正常にアクセスできることが確認できました。

バーチャルホスト”test1.localhost”をhttps化する手順

次に、バーチャルホスト機能を使っている「test1.localhost」を「https://」でアクセスできるようにする場合を解説します。

ここからの解説は、上記の「localhostのhttps化」と異なる部分について記載します。以下の手順は「localhostのhttps化」と異なりませんので、記載は割愛します。

「”localhost”のhttps化」の手順と異ならない手順
  • 作成したサーバー証明書を移動
  • サーバー証明書をインストール

OpenSSL設定ファイルの編集

「C:¥xampp¥apache¥conf¥openssl_localhost.cnf」に、「test1.localhost」の設定を、以下のように追加します。

「openssl_localhost.cnf」に「test1.localhost」の設定を追加
「openssl_localhost.cnf」に「test1.localhost」の設定を追加

バーチャルホストの設定ファイルに、HTTPSアクセスの設定追加

バーチャルホストの設定ファイル「C:¥xampp¥apache¥conf¥extra¥httpd-vhosts.conf」に、以下の設定を追加します。バーチャルホストの設定ファイルには、既にHTTPでのアクセス、つまり80番ポートでのアクセスが設定してあるわけですから、その設定に443ポートでのアクセス設定を追加する形になります。

<VirtualHost *:443>
    DocumentRoot "c:/www/test1/htdocs"
    ServerName test1.localhost
    SSLEngine on
    SSLCertificateFile "conf/ssl.crt/test1_localhost.crt"
    SSLCertificateKeyFile "conf/ssl.key/test1_localhost.key"
    ErrorLog "c:/www/test1/log/error.log"
    CustomLog "c:/www/test1/log/access.log" common
</VirtualHost>

ここでの設定のポイントは、以下の2つです。

  • 5行目 … サーバー証明書のファイル名は「test1_localhost.crt」
  • 6行目 … 暗号化キーファイルのファイル名は「test1_localhost.key」

次のスクリーンショットは、追加後のイメージです。

バーチャルホストの設定ファイル
バーチャルホストの設定ファイル

サーバー証明書を作成

“Git Bash”を使用して、「C:/xampp/apache/conf」にCDし、以下のコマンドで”test1.localhost”のサーバー証明書を作成します。

openssl req \
-newkey     rsa:2048 \
-keyout     test1_localhost.key \
-x509 \
-nodes \
-out        test1_localhost.crt \
-subj       "//CN=test1.localhost" \
-reqexts    SAN \
-extensions SAN \
-config     openssl_localhost.cnf \
-days       3650

ここでの設定のポイントは、以下の3つです。

  • 3行目の「test1_localhost.key」… 暗号化キーファイル名。
  • 6行目の「test1_localhost.crt」… サーバー証明書のファイル名。
  • 7行目の「test1.localhost」… バーチャルホストのドメイン名。

作成した証明書を所定の場所に移動し、インストールしてください。

動作確認

Apacheを起動または再起動し、「https://test1.localhost」でアクセスできるか確認します。

「https://test1.localhost」でアクセスできたところ
「https://test1.localhost」でアクセスできたところ

上のスクリーンショットの通り「https://test1.localhost」でアクセスできました。以上で「XAMPP」で動作しているサイトの「HTTPS化」の方法解説は終了です。

ローカル環境 XAMPP
よかったらシェアしてね！
  • URLをコピーしました！

関連記事

目次