XAMPPでPHP【htdocs以外のフォルダ利用と複数サイトの利用：Windows10】

XAMPPをインストールして開発環境をローカルPCに作っている場合、localhostの向き先が、インストール先のxamppフォルダ配下のhtdocsになります。

「htdocs以外を使いたい。
　複数の案件の開発をしている場合、複数サイトを別々のフォルダに作成したい」

という要望はごく普通にあると思います。

今回は、それに対する設定について記載します。

XAMPPで利用可能な開発環境を増やす方法

増やすためのポイントは３点です。

それぞれやりかたをみていきます。

ポートを増やす(localhost:8088 等でアクセスできるようにする)

C:/xampp/apache/conf の配下に[httpd.conf]というファイルがあるので、Listenを記述する。

Listen [ポート番号]

ローカルホストで利用している Listen 80 という行があるため、その下に使いたいポート番号を増やします。
例えば、下記のような行を httpd.conf に追加します。
Listen 8088

※ローカル開発環境だと8080番代が利用されるケースがよくあります。

これをやることで、指定したポート番号が使えるようになります。

アドレスを設定する(mytestsite.com などでアクセスできるようにする）

C:/Windows/System32/drivers/etcの下に[hosts]というファイルがあるので、IPアドレスとアクセスしたい名称を指定する。

127.0.0.1 [アクセス用のアドレス名]

localhostのアドレスが、127.0.0.1に指定されているので、それに割り当てを実施します。
例えば、下記のように指定します。
127.0.0.1 mytestsite.com

編集できない場合には、別のフォルダ（デスクトップ等）にhostsをコピーして、編集後にコピー上書きを実施すれば書き込み可能です。

仮想フォルダに割り当てる(htdocs以外のフォルダを割り当てる）

C:/xampp/apache/conf/extraの配下に[httpd-vhosts.conf]というファイルがあるので、仮想ホストを追加する。

< VirtualHost *:[ポート番号] >
DocumentRoot [配置先のフォルダ名]
< Directory [配置先のフォルダ名]>
AllowOverride All
Require all granted
< /Directory >
ServerName [アクセス用のアドレス名]
< /VirtualHost >

ここでの指定が、上で指定したアドレス名やポート番号を紐づける指定になります。
記載箇所は、上記[]で示す３か所になります。

なお　< Directory >～< /Directory > の指定は、XAMPPでhtdocs配下以外のフォルダへのアクセスを許可するための指定になるため、httpdocs配下にフォルダを指定する場合にはこの指定は不要になります。

以上、設定の基本的な考え方を理解したら、実際にPHPの開発環境をつくってみます。

なお、XAMPPとPHPのインストールは既に完了している前提になりますが、未完了の場合には、下記の記事でインストールについて書いています。

XAMPPでPHPの開発環境を増やしてみる

実際のPHPの環境は、Cドライブルートの下にphpdevというフォルダを作成し、その下に３環境使えるようにしてみます。
想定としては、本番最終テスト版を１環境と、開発テスト用に２環境用意するイメージになります。

c:/phpdevの配下に下記のフォルダを作成
mysite.test (最終テスト環境）
mysite8087 (開発テスト環境１）
mysite8088 (開発テスト環境２）

アクセスは、以下のように設定します。

http://mysite.test => c:/phpdev/mysite.test
http://mysite.test:8087 => c:/phpdev/mysite8087
http://mysite.test:8088 => c:/phpdev/mysite8088

ただし、ローカルホストはもとのままアクセスできるようにします。
http://localhost => c:/xampp/htdocs
XAMPPを立ち上げていない状態で設定を実施します。

設定の実施

手順１）フォルダを作成します。

Cドライブに、phpdevおよび、mysite.test、mysite8087、mysite8088を作成します。

手順２）ポートを増やします。

C:/xampp/apache/conf の配下の[httpd.conf]ファイルに下記を追記
Listen 8087

Listen 8088

手順３）アドレスを設定します。

C:/Windows/System32/drivers/etcの下の[hosts]ファイルに以下を追記
127.0.0.1 mysite.test

手順４）仮想フォルダの割り当てをします。

C:/xampp/apache/conf/extraの配下に[httpd-vhosts.conf]ファイルに下記を設定

localhostからのアクセスも可能なように設定も追加しておきます。

<VirtualHost *:80>
　DocumentRoot "C:/xampp/htdocs/"
　ServerName localhost
</VirtualHost>

<VirtualHost *:80>
　DocumentRoot "C:/phpdev/mysite.test/"
<Directory "C:/phpdev/mysite.test/">
　AllowOverride All
　Require all granted
</Directory>
　ServerName mysite.test
</VirtualHost>
 

ここまでの設定で、http://mysite.test でのアクセスができるようになっていますが、開発用にポート番号でのアクセスも可能にするために、下記の設定をさらに追記します。

<VirtualHost *:8087>
　DocumentRoot "C:/phpdev/mysite8087/"
<Directory "C:/phpdev/mysite8087/">
　AllowOverride All
　Require all granted
</Directory>
　ServerName mysite.test
</VirtualHost>

<VirtualHost *:8088>
　DocumentRoot "C:/phpdev/mysite8088/"
<Directory "C:/phpdev/mysite8088/">
　AllowOverride All
　Require all granted
</Directory>
　ServerName mysite.test
</VirtualHost>
 

これで一通りの設定が完了しました。

確認の実施

環境として準備した３つのフォルダの直下に、index.php ファイルを配置します。

中身はなんでもいいですが、各サイトに実際にアクセスしたのがわかるように、それぞれ

各フォルダ配下のindex.php

< ?php echo 'hello(サイト名：ポート番号)'; ? >

のようにして、各フォルダに配置します。

XAMPPを起動して、Apacheをスタートします。

実際にブラウザからアクセスすると。

設定完了です。

念のために、localhostでアクセスして、アクセス可能なことも忘れずに確認しておくようにします。

やり方がわかれば、この方法でサイト環境を増産可能です。
XAMPPは、別にPHPに限らず、Webサーバーやデータベースを立てて試すのには手軽でつかいやすい仕組みです。

是非、活用してみてください。

最後までお読みいただき、ありがとうございました。