XAMPPでルートパスを使えるようにする方法

XAMPPでローカルサーバーを利用する場合、htdocsの中に階層を分けて複数サイトを置いているとルートパス指定のサイトは階層がずれてしまいうまく表示されません。

例えばこんな感じでhtdocsの中に複数サイトを置いていて

C:\xampp\htdocs\siteA
C:\xampp\htdocs\siteB
C:\xampp\htdocs\siteC

表示させようとすると通常はこのように表示されてしまいます。

http://localhost/siteA/~
http://localhost/siteB/~
http://localhost/siteC/~

でもこのように表示できればルートパスが使用できるようになるので表示させたい!

C:\xampp\htdocs\siteA  http://siteA
C:\xampp\htdocs\siteB  http://siteB
C:\xampp\htdocs\siteC  http://siteC

目次

パスの簡単な説明

絶対パスとは?

http://~ ではじまるパス。

相対パスとは?

自分がいるところを基準に./../で指定するパス。

同じ階層./ファイル名 またはそのままファイル名
下の階層./フォルダ名/ファイル名
上の階層../ファイル名
2階層上../../ファイル名

ルートパスとは?

ルートから始まるパス。http://○○○.com /common/img/abc.jpg
/common/img/abc.jpg ←この部分
ルートパスにしておくと階層が変わったときやドメインが変わったときなど変更しなくていいので便利です。ただしサーバーに上がってないと表示できないのでローカル環境では表示できません。XAMPPなどのローカルサーバーを利用すれば使えるようになります。

XAMPPのファイル修正方法

こちらの階層に置いてあるサイトを今回表示させてみます。

C:\xampp\htdocs\siteA

1. httpd.confファイルに追加

C:\xampp\apache\conf\httpd.conf

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

今まで通りlocalhostで使用する用と新しくsiteAのVirtualHostを追加します。
※今回Dドライブなのでご自身のパスをはめてください。

2. hostsファイルに追加

C:\Windows\System32\drivers\etc\hosts

hostsファイルに以下一行を一番下に追加します。

127.0.0.1 siteA

あわせて読みたい
hostsファイルの上書き保存ができない場合 hostsファイルを上書き保存したいのに権限エラーが出てしまい保存できないことがあります。 C:\Windows\System32\drivers\etc\hosts とりあえずこちらの方法でアクセス...

3. xampp再起動

xamppのapacheを再起動します。

http://siteA

これで直接siteAの階層を見るようになるので/common/img/~などのルートパスで指定したファイルが表示されるようになりました。

  • URLをコピーしました!
目次