以前にxamppを利用してローカルサーバやってみようっていうエントリーを上げたワケですが、
■サーバー環境を作る XAMPP 1.5.4-修正内容版
あとちょっとだけ便利になる(かもしれない)方法も遺しておこうと思います。
上記エントリーでは、ローカルサイト管理に
www ━┳━ index.html
┃
┣━ サイト01
┃
┣━ サイト02
┃こうすると良いですよーって書いてたんですが、例えば絶対パスでサイトを管理して、Dreamweaverで編集する時なんか、これではちょっと不都合が出る場合もあります。
http://localhost/site01/ ってサイトがあったとして、cssを絶対パスで指定してみます。
cssは /site01/css/styles.css って形で保存されてるとします。
site01内のコードには、/css/styles.css って記述がなされます。
でもこの状態って、正確な絶対パスは「/localhost/css/styles.css」になるワケで、サイトをブラウザで表示させてみたところで正しいスタイルは適用されてません。
(´･ω･)ｼｮﾎﾞｰﾝですね。
それならxamppのドキュメントルートを変更して！なんてしてたら間がもちません、色々と。
なので、ここで例に挙げた「http://localhost/site01/」ってサイトを、「http://site01/」というアドレスでアクセスしたら見れるようにしてみましょう。
これなら編集した絶対パスもそのまま活かせますし、ブラウザで表示させても絶対パスが働いて、キチンとcssが反映される！という目論みです。
ApacheのVirtualhostを利用してみる
Virtualhost＝バーチャルホスト というのは、ひとつのサーバで複数のドメインを運用可能に出来る機能です。
1つのIPアドレスに複数のドメイン名を割り当てることで、1台のウェブサーバでも複数のウェブサイトを同時運用することができるようになっちゃったりします。
■バーチャルホストの例 - Apache HTTP サーバ
■バーチャルホストとは 【virtual host】 - 意味・解説 ： IT用語辞典
というワケで早速進めてみます。
先ずはxamppの「/xampp/apache/conf/httpd.conf」ファイルを開きます。
それから「NameVirtualHost *:80」という箇所を探して、コメントアウトしてあったらそれを外して有効にします。
先頭に「＃」が付いてたらコメントアウト状態。なのでシャープを消します。
見つからない時は、ファイルの最後当りにでも書いちゃって下さい。
バーチャルホストのサイト指定を行う
次に、サイトのルートはこれなんです、って指定をhttpd.confファイルに書きます。
色んな環境(ディレクトリ構成)のヒトがいると思うのですが、ここではとりあえず「Dドライブ直下にxamppを置いてる場合」というのを想定してみました。
NameVirtualHost *:80
<VirtualHost *:80>
DocumentRoot "D:/xampp/htdocs"
ServerName localhost
</VirtualHost>
<VirtualHost *:80>
DocumentRoot "D:/xampp/htdocs/site01"
ServerName site01
</VirtualHost>
最初の1行目は上の段階のVirtualhostを有効にする指定です。
前項で既に有効化してる場合は、これは含めずに。
htdocs直下もそのまま使えるように指定しておきます。
それから、「site01」がドキュメントルートにもなるんです！って指定を行います。
ServerName の箇所をディレクトリ名に指定する事を忘れずに。
hostファイルの書き換え
下記のディレクトリ内にある host ファイルを書き換えます。拡張子はついてないです。
C:/WINDOWS/system32/drivers/etc/host
ファイルを開いたら、
127.0.0.1 localhost
127.0.0.1 site01
という風に記述を加えます。
localhostの方はもともと書いてあると思うので「site01」の行を書くだけで済むかもです。
hostファイルって何だろう？って思った方はこちらへどうぞ。
■hostsファイルとは？
サーバの再起動
上記までの手順が終ったら、xamppのApacheを再起動です。
xampp自体はそのままで構いません。xamppのControl PanelでApacheのOFF→ONです。
xampp便利だよxampp。
そして、正常に起動したらブラウザのアドレスバーにでも「http://site01/」と入力して開いてみて下さい。
site01のトップは表示されましたか？
「http://localhost/site01/」の時にはcssも適用されませんでしたが、「http://site01/」では絶対パスも有効になり、cssも適用されてるハズです。
おしまい。
あとがき
wordpressやMTなんかの場合、URLは指定出来るし、Dreamweaver使えばcssも別途、テンプレートに適用させる事が出来るので問題ないんですが、通常のhtmlサイト作成時にはこれやっとくと便利だったりします。
Virtualhost使って http://site01/ にしている際にも、もとの http://localhost/site01/ も有効なのでそれまで通りな使い方も出来ます。
毎回ふたつのファイルの編集が必要になりそうですが、必要なサイトにだけ指定を行うようにしておけば良いですしねヾ(´･ω･)ﾉﾞ
