What is Virtual Host? How to configure Virtual Host in XAMPP?

Virtual Host is a configuration in Apache that allows multiple domains to run on one server. There is another concept mentioned in Nginx that has the same function as Virtual Host called Server Block. In this article, I just want to share with you strange about Virtual Host how to configure a Virtual Host in Windows, here I use XAMPP as a development environment.

Configure Virtual Host in XAMPP

How to configure Virtual Host in XAMPP

You can download XAMPP from https://www.apachefriends.org

After the installation is complete, open: <xampp_folder>/apache/conf/httpd.conf

Find the line: Include conf/extra/httpd-vhosts.conf, If you see a # at the beginning of the line, remove it. This line is only for loading config from another file into the httpd.conf.

With Xampp, this file is included by default. But I still want to update this step so that if you use other software to create Web Server such as Vertrigo, WAMP, App Server, etc, you can still use Virtual Host configuration. Especially, you can also install a file with a different name (this is not important because as long as you include the Virtual Host configuration in httpd.conf is okay).

Now open the file <xampp_folder>/apache/conf/extra/httpd-vhosts.conf, copy the code below and paste into the httpd-vhosts.conf file.

  • <VirtualHost></VirtualHost>: This is a pair of tags that signal the beginning and end of a declaration to Vhost. There is a small note that if you change the port of Apache (8080.81, etc.), you must also change the number 80 according to your port.
  • ServerAdmin: Keyword declares admin email address (Optional).
  • DocumentRoot: This is the keyword that declares the directory path to be called when the user accesses the configured domain. This path may be located in any partition.
  • ServerName: It is the domain you want to place.
  • ErrorLog: Specify the path of the log file when there is an error (optional) <xampp_folder>/apache/logs is the directory of the log file.
  • CustomLog: Save log all Uri that request user (optional) <xampp_folder>/apache/logs is the directory containing the log file.
  • <Directory></Directory>: This is the pair of cards used to grant access to the directory if an unlicensed folder will receive a 403 error when you try to access it. Your directory path can be a regular expression. If you are not sure about Regex then you can use the directory path similar to the declaration in DocumentRoot or refer to at http://httpd.apache.org/docs/2.4/en/mod/core.html#directory
  • Options FollowSymLinks: This option allows you to access symbolic links (just like shortcuts in windows). In addition, there are many other options, you can refer to at http://httpd.apache.org/docs/2.4/en/mod/core.html#options
  • AllowOverride All: Allows you to overwrite the config using htaccess file.
  • DirectoryIndex index.php: When you access the directory (not specified which file), the index.php file will be called.
  • Require all granted: Allow all other machines to access the directory being configured. Note: Apache version 2.2 and earlier is used Allow from all to replace for Require all granted

You restart Apache by restarting the XAMPP software.

Ok, so you’ve finished configuring the Apache part, now you just need to register DNS for your domain and everything is done.

You open the file %windir%/system32/drivers/etc/hosts with notepad or any editor. Add to the end of the file and save it. If you cannot save the hosts file, be sure to turn off Readonly and try running again in Administrator mode.

When you type yourdomain.com address, the machine will prioritize to find the IP address of that domain in the hosts file of the operating system first. If not, it will find the IP address of this domain through DNS servers on the Internet. Because you have declared in the hosts file, it will use the IP address declared in it. Here the IP address – 127.0.0.1 points to the device it is accessing (which is your own computer – if configured on the server, it is the server itself). You can use the IP range from 127.0.0.1 -> 127.255.225.254, this is the IP range pointing to your device (Full range, not just 127.0.0.1).

Now you open your browser and type in the address bar to replace the ugly localhost with your own domain.

Conclusion

Using Virtual Host has several benefits:

  • You can access any code directory without having to copy to htdocs folder in XAMPP.
  • If you use the code folder in another partition, you don’t need to worry about backing up the code folder every time you reinstall Windows.
  • Looks more dangerous. :v

You can also configure Vhost with WAMP, APPServer, USBServer, etc, the configuration is not much different because all these software uses Apache, Mysql, and PHP. Virtual host is a feature of Apache, not XAMPP, so any software using Apache can configure Virtual host in the same way, the only difference is the location of the httpd.conf file.

Good luck!

Leave a Reply

Your email address will not be published. Required fields are marked *