windows7のXAMPPでバーチャルホストの設定をする

ローカルの開発環境としてXAMPPをインストールしているのですがバーチャルホストの設定でいつも「あれ、どこを触るんだっけ？」ということになるので備忘録として記事にしておきます。尚、OSはwindows7になります。

1.バーチャルホストとは
2.編集するファイルと格納場所
3.動作確認

1.バーチャルホストとは

ひとつのサーバーで複数のドメインを運用する技術のことで、ローカルにバーチャルホストを設定することで、ひとつのパソコンで複数のサイト及びプロジェクトを管理することを目的としています。

今回はサブドメイン形式で運用する方法を記述しますので、ブラウザから

localhost
wordpress.localhost
wordpress2.localhost

とアクセス出来るようにします。また、それぞれ別々のフォルダに格納させる事でソースの管理がやりやすくなります。
フォルダの構造は下記の通りとします。

localhost→デフォルトのまま利用する（C:/xampp/htdocs）
wordpress.localhost→C:/xampp/htdocs/wordpress
wordpress.localhost2→C:/xampp/htdocs/wordpress2

それぞれのフォルダの中にindex.htmlファイルを作成し、中に適当な文言を記述しておきましょう。

2.編集するファイルと格納場所

今回はすでにXAMPPがローカルにインストールされている前提で書いていきます。また、インストール先はデフォルトであるc:xamppという構成としています。

実際に編集するファイルは

C:/xampp/apache/conf/extra/httpd-vhosts.conf
C:/windows/System32/drivers/etc/hosts

の2つです。

「httpd-vhosts.conf」を編集する

C:/xampp/apache/conf/extra/httpd-vhosts.confをテキストエディタで開きます。すると下記のような内容になっているかと思います。

#
# Virtual Hosts
#
# If you want to maintain multiple domains/hostnames on your
# machine you can setup VirtualHost containers for them. Most configurations
# use only name-based virtual hosts so the server doesn't need to worry about
# IP addresses. This is indicated by the asterisks in the directives below.
#
# Please see the documentation at
# <URL:http://httpd.apache.org/docs/2.2/vhosts/>
# for further details before you try to setup virtual hosts.
#
# You may use the command line option '-S' to verify your virtual host
# configuration.

#
# Use name-based virtual hosting.
#
##NameVirtualHost *:80
・
・
・

ソース内にある「#」はその行をコメントアウトにする為の記号で、#が入っている行は実行されません。
#NameVirtualHost *:80の行を有効にする必要があるので、コメントアウトになっている場合は#を削除し、その行を有効にします。

次にサブドメインの設定を行うため、下記ソースを一番最後の行に追加します。

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

<VirtualHost *:80>
DocumentRoot C:/xampp/htdocs/wordpress
ServerName wordpress.localhost
</VirtualHost>
<Directory "C:/xampp/htdocs/wordpress">
order deny,allow
allow from ALL
</Directory>

<VirtualHost *:80>
DocumentRoot C:/xampp/htdocs/wordpress2
ServerName wordpress2.localhost
</VirtualHost>
<Directory "C:/xampp/htdocs/wordpress2">
order deny,allow
allow from ALL
</Directory>

追加できたら上書き保存して終了します。

「hosts」を編集する

windows7では直接このファイルを修正することが出来ません。管理者権限でアクセスする必要があります。

メモ帳を右クリックし、管理者として実行

メニューのファイル＞開くを選択し、「C:/windows/System32/drivers/etc/」を指定。ファイルタイプを「テキスト文章」になっている箇所を

「すべてのファイル」に変更し「hosts」を開く。
127.0.0.1 localhostとなっている箇所があるので、その下の行に

127.0.0.1       localhost
127.0.0.1       wordpress.localhost
127.0.0.1       wordpress2.localhost

を追加し、保存して終了します。<//p>

3.動作確認

ファイルへの記述が出来たら動作を確認します。XAMPPパネルを起動している場合はapacheの再起動が必要となりますのでstopをクリックしてapacheを停止させ、そのままstartをクリックして再度起動します。

この時stopをクリックしても「Busy—ERROR: -1」のようなエラーが出て停止できない場合は、XAMPPパネルをexitより動作を止め、再度xamppパネルを管理者として実行してみてください。そうすることでstopさせることが出来る場合があります。

あとはブラウザを立ち上げ、URLに「http://wordpress.localhost」及び、「http://wordpress2.localhost」とそれぞれ入力してアクセスし、作成していたindex.htmlの中身が表示されれば成功です。

参考にさせていただいたサイト[XAMPP]WinXPローカル環境で複数ドメイン管理

お役に立てたらお願いします🙇