XAMPP for Mac OS Xのバーチャルホスト設定

やっておいたら便利な設定。バーチャルホスト！

例えば、ローカルで"site01"と"site02"っていうサイトを管理しているとします。
設定してない状態だとこんな感じ↓

このままだとcssを絶対パスで指定する時、
実際のサーバー上では/css/style.cssなのに、上記の状態のままだと/site01/css/style.css
となるので、実際のサーバーに上げる時パスを書き換えたりなんやら面倒だったりするので、
 
↑こんな感じになる様に設定をします！


▶まずはhttpd.confファイルの書き換えてバーチャルホストを有効にします

/Applications/XAMPP/xamppfiles/etc/httpd.confファイルを開きます。

469行目の

#Include /Applications/XAMPP/etc/extra/httpd-vhosts.conf

を

Include /Applications/XAMPP/etc/extra/httpd-vhosts.conf

にします。（行頭の"#"を消しただけ。）
そして保存します。


 ▶httpd-vhosts.confファイルを書き換える。

 /Applications/XAMPP/xamppfiles/etc/extra/httpd-vhosts.confファイルを開きます。

27行目〜42行目の

<VirtualHost *:80>

    ServerAdmin [e-mail]

    DocumentRoot "/Applications/XAMPP/xamppfiles/docs/dummy-host.example.com"

    ServerName dummy-host.example.com

    ServerAlias www.dummy-host.example.com

    ErrorLog "logs/dummy-host.example.com-error_log"

    CustomLog "logs/dummy-host.example.com-access_log" common

</VirtualHost>

<VirtualHost *:80>

    ServerAdmin [e-mail]

    DocumentRoot "/Applications/XAMPP/xamppfiles/docs/dummy-host2.example.com"

    ServerName dummy-host2.example.com

    ErrorLog "logs/dummy-host2.example.com-error_log"

    CustomLog "logs/dummy-host2.example.com-access_log" common

</VirtualHost>

を

#<VirtualHost *:80>

#    ServerAdmin [e-mail]

#    DocumentRoot "/Applications/XAMPP/xamppfiles/docs/dummy-host.example.com"

#    ServerName dummy-host.example.com

#    ServerAlias www.dummy-host.example.com

#    ErrorLog "logs/dummy-host.example.com-error_log"

#    CustomLog "logs/dummy-host.example.com-access_log" common

#</VirtualHost>

#<VirtualHost *:80>

#    ServerAdmin [e-mail]

#    DocumentRoot "/Applications/XAMPP/xamppfiles/docs/dummy-host2.example.com"

#    ServerName dummy-host2.example.com

#    ErrorLog "logs/dummy-host2.example.com-error_log"

#    CustomLog "logs/dummy-host2.example.com-access_log" common

#</VirtualHost>

にします。（全ての行頭に"#"をつけただけ。）


▶ http://localhost/を有効にする

バーチャルホストが有効になったことで"http://localhost/ "が無効になるので、復元してあげましょう。
 
さっきのファイル（httpd-vhosts.conf）に

<VirtualHost *:80>  

    DocumentRoot "/Applications/XAMPP/xamppfiles/htdocs"  

    ServerName localhost  

</VirtualHost>  

を書き加える。


▶バーチャルホストを追加する

さっきのファイル（httpd-vhosts.conf）に

<VirtualHost *:80>  

    DocumentRoot "/Applications/XAMPP/htdocs/追加させたいフォルダ名"  

    ServerName 任意のホスト名  

</VirtualHost>

を書き加える。そして保存します(´・ω・)
 
例："site01"を追加する場合 はこんな感じで書き加えます↓

<VirtualHost *:80>  

    DocumentRoot "/Applications/XAMPP/htdocs/site01"  

    ServerName site01  
</VirtualHost> 

 

▶hostsファイルを書き換える

Finderのメニューバーの"移動"から"フォルダへ移動"を選択する。 ( ＋ shift ＋ G)
/etc/ と入力して"移動"ボタンをポチっとクリック。

"etc"フォルダの中の"hosts"ファイルを開く。

127.0.0.1   severnameに指定したホスト名 

を書き加えて保存。

例："site01"を追加する場合 はこんな感じで書き加えます↓

127.0.0.1   site01

※標準搭載のテキストエディットだと保存できないので、別のエディタを使用して下さい。
フリーソフトだとmiが有名みたいですよ。 

そして、Apache を再起動させて設定を反映して完了！

これでhttp://site01/のアドレスで"site01"フォルダにアクセスできます(ﾉ´∀｀*)


バーチャルホストを増やす場合は 

▶バーチャルホストを追加する
▶hostsファイルを書き換える

の作業で書き加えるだけですヾ(ﾟ∀ﾟ)ﾉ

簡単で便利なんで是非、バーチャルホストの設定をしてみて下さいねー(ﾉ´∀｀*) 

Comments

▶hostsファイルを書き換える
127.0.0.1 severnameに指定したホスト名
って言うのは、何を記入したら良いのでしょうか？
取得したドメインで良いのでしょうか？

1. Posted by ココ at 2012年09月10日 02:04

XAMPPが入ってるパソコン内で「http://example/」として表示させたかった場合、

httpd-vhosts.confファイルに書き加えた

ServerName example
　　　　　　　↑この名前の部分を

hostsファイルに

127.0.0.1 example

と追加してください＾＾

別のパソコンからhttp://example/にアクセスしたい時は、アクセスしたいPCのhostsを、

メインPCのIPアドレス example

って書いたらいけると思いますー(ﾉ´∀｀*)

2. Posted by ちん at 2012年09月10日 05:01

とてもわかりやすい説明でした。ありがとうございます。

質問なんですが、説明通りにバーチャルホストを設定してみたところ、Access forbidden! となってしまって、接続できません。これを解決するためにはどうしたらいいでしょうか。是非、ご教授お願いします。

3. Posted by Kang Yoosam at 2015年05月03日 17:38

Kang Yoosamさん
コメントありがとうございます。
こちらの記事が参考になるかもしれません(^^)

XAMPP(Apache 2.4以降)で403エラー(Access forbidden!)が消えない場合の対処法
http://www.hachi-log.com/xampp-apache-403/

4. Posted by ちん at 2015年05月03日 22:23