2012年01月30日

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 webmaster@dummy-host.example.com
    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 webmaster@dummy-host2.example.com
    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 webmaster@dummy-host.example.com
#    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 webmaster@dummy-host2.example.com
#    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ファイルを書き換える

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

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

この記事へのトラックバックURL

http://trackback.blogsys.jp/livedoor/ec_chin/2602294 

トラックバックはまだありません。

この記事へのコメント

▶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