Skip to content

Wildcard virtual hosts and DNS

Jump to bottom
Lubos Kmetko edited this page Oct 25, 2017 · 3 revisions

This guide is intended for users without experience with setting up Apache development server for PHP apps, like WordPress.

Throughout this guide I assume that your username is developer and you store your projects inside ~/Projects directory.

macOS

Based on awesome tutorial from Chris Millinson.

This tutorial assumes you have MySQL and Apache installed (they come by default with macOS). If you use MAMP, use it as you like, but this tutorial aims for built-in Apache & MySQL setup. You can find additional information about where MAMP stores its config files in this article

Make sure you have Xcode (xcode-select --install) and brew installed.

1. Install and setup dnsmasq

This is for *.test domain wildcarding

brew install dnsmasq
cd $(brew --prefix); mkdir etc; echo 'address=/.test/127.0.0.1' > etc/dnsmasq.conf
sudo cp -v $(brew --prefix dnsmasq)/homebrew.mxcl.dnsmasq.plist /Library/LaunchDaemons
sudo launchctl load -w /Library/LaunchDaemons/homebrew.mxcl.dnsmasq.plist
sudo mkdir /etc/resolver
sudo bash -c 'echo "nameserver 127.0.0.1" > /etc/resolver/test'

2. Edit /etc/apache2/httpd.conf

Uncomment the line (remove #):

LoadModule vhost_alias_module libexec/apache2/mod_vhost_alias.so

3. Edit /etc/apache2/extra/httpd-vhosts.conf

Add VirtualHost config

Reminder – I'm assuming your username is developer and your store projects inside ~/Projects directory

<VirtualHost *:80>
  ServerAlias localhost *.test
  VirtualDocumentRoot /Users/developer/Projects/%1/wp # Chisel stores WP inside wp folder in the root of your project
  UseCanonicalName Off
  <Directory "/Users/developer/Projects">
    Options FollowSymLinks
    AllowOverride All
    Order allow,deny
    Allow from all
    Require all granted
  </Directory>
</VirtualHost>

4. Restart Apache

sudo apachectl restart

Linux

For now let's just follow the article here: http://brunodbo.be/blog/2013/04/26/setting-up-wildcard-apache-virtual-host-wildcard-dns

Windows

1. Install and setup Acrylic DNS Proxy

This is for *.test domain wildcarding

Download and install Acrylic DNS Proxy, then set it up at your system, eg. Windows 10

Add 127.0.0.1 *.test to AcrylicHosts.txt file so it looks like:

127.0.0.1 localhost localhost.localdomain
::1 localhost localhost.localdomain
127.0.0.1 *.test

2. Edit httpd.conf

If you are using XAMP it would be located in c:\xampp\apache\conf. Uncomment the line (remove #):

LoadModule vhost_alias_module modules/mod_vhost_alias.so

3. Edit httpd-vhosts.conf

If you are using XAMP it would be located in c:\xampp\apache\conf\extra. Add VirtualHost config:

<Directory "C:/xampp/xampp/htdocs/">
     Options Indexes FollowSymLinks Includes ExecCGI
     AllowOverride All
     Order allow,deny
     Allow from all 
 </Directory>

<VirtualHost *:80>
    ServerName localhost
    ServerAlias localhost
    DocumentRoot c:/xampp/htdocs/
</VirtualHost>

<VirtualHost *:80>
    ServerAlias *.test
    VirtualDocumentRoot c:/xampp/htdocs/%-1/%-2+/wp #notice wp at the end, that's because Chisel serves WP from a subfolder
</VirtualHost>

4. Restart Apache

Restart Apache from the XAMPP control.

You're all set up!

Now your projects inside ~/Projects directory (c:\xampp\htdocs\test in Windows) will directly map to *.test host, so:

  • /User/developer/Projects/testproject (c:\xampp\htdocs\test\testproject) will be available under http://testproject.test
  • /User/developer/Projects/mywork (c:\xampp\htdocs\test\mywork) will be available under http://mywork.test

And so on. Chisel will set up BrowserSync proxy for you under your-project-name.test address. It's advisable that you name your project (during yo chisel command) exactly the same as the directory you're in, so there's no need for you to configure anything.

Clone this wiki locally