Setup wildcard-based subdomains in apache local server

Virtual Host is one of the main features of an Apache server that allows one to host multiple websites or applications on the same server and make them easily accessible under a different domain name. However, if you have a large number of virtual hosts that have a nearly identical configuration, wildcard-based subdomains simplify maintenance and reduce the hassle of adding a new virtual host.

With wildcard subdomains, you no longer need to edit the Apache configuration file or restart the server to initialize a new virtual host. Instead, you simply need to create a subdirectory that matches the subdomain name on the server hosting your content and let Apache use that directory to serve requests from the appropriate subdomain.

This guide will walk you through the process of configuring wildcard virtual hosts with XAMPP so that requests for subdomain.localhost are automatically served from the subdomain/ directory in the main server’s document root.

Follow these steps: Open a new Linux terminal and make sure you are logged in as root.

• Change to your XAMPP installation directory (typically, /opt/lampp) and open the httpd.conf file in the etc/ subdirectory using a text editor.
• In the file, locate the following line and remove it by removing the hash sign (#) at the beginning of the line.

Include etc/extra/httpd-vhosts.conf

• Open the httpd-vhosts.conf file in the etc/extra/ subdirectory of your XAMPP installation directory using a text editor.
• Replace the contents of this file with the following directives:

UseCanonicalName Off
<VirtualHost *:80>
       DocumentRoot "/opt/lampp/htdocs/"
       ServerName localhost
</VirtualHost>
<VirtualHost *:80>
       ServerAlias *.localhost
       VirtualDocumentRoot "/opt/lampp/htdocs/%1/"
</VirtualHost>

In this configuration, the primary virtual host block configures how requests are handled by default. The second block configures virtual wildcard hosting for subdomains, and specific requests for subdomain.localhost is served by the subdomain/ directory of the /opt/lampp/htdocs/ directory. In particular, notice the placeholder %1, which matches the subdomain name of the request URL.

• Restart Apache using the XAMPP control panel for your changes to take effect.
• This is where your wildcard subdomains will be set up. You can easily test this by creating two new subdirectories under /opt/lampp/htdocs/sub01/ and /opt/lampp/htdocs/sub02/. In each subdirectory, create a file called .html index and fill it with sample HTML content. Use different content for each file so you can easily distinguish that they are served from different directories.
• Since these domains don’t actually exist, you just need to map them to the local IP address. Run this command to your terminal.

sudo nano /etc/hosts

Add the following line:

127.0.0.1   sub01.localhost  sub02.localhost

At this point, you should be able to type the URLs http://sub01.localhost or http://sub02.localhost into your web browser and you should then see the corresponding HTML page.