Root requests resolving to wrong VirtualHost in Apache

Question

I have two web sites running behind an Apache server.

One of them serves requests to api.xyzzy.com

The other serves any other traffic that comes in (dozens of domains, subdomains, etc) and is thus a catch-all wildcard.

Using the config below, requests to deep links under http://api.xyzzy.com/ ... go to the correct virtual host (the first one), but top-level requests to http://api.xyzzy.com/ load the second catch-all wildcard virtual host instead.

What have I done wrong here?

LoadModule passenger_module /home/webby/.rvm/gems/ruby-1.9.3-p286/gems/passenger-3.0.18/ext/apache2/mod_passenger.so
PassengerRoot /home/webby/.rvm/gems/ruby-1.9.3-p286/gems/passenger-3.0.18
PassengerRuby /home/webby/.rvm/wrappers/ruby-1.9.3-p286/ruby

NameVirtualHost *:80

<VirtualHost *:80>
        ServerName api.xyzzy.com
        ServerAlias api.xyzzy.com
        RailsEnv production
        DocumentRoot /home/webby/rails/current/public
</VirtualHost>

<VirtualHost *:80>
        ServerAlias *
        <Directory /usr/local/xyzzy/webapps/wwwroot >
                Options Indexes MultiViews
                AllowOverride None
                Order allow,deny
                Allow from all
        </Directory>
        DocumentRoot /usr/local/xyzzy/webapps/wwwroot
</VirtualHost>

UPDATE:

The configuration below appears to be working as expected now. This is based on @Winfield's answer.

It seems my testing might have been in error. My browser (Chrome) might have been auto-completing the address I was typing in with an https (not http) prefix. Unfortunately I didn't notice this anomaly until after trying dozens of permutations of configurations so it's hard to tell what the final proper resolution was. I should have been using curl on the command line for a more reliable test rather than typing in the browser bar.

<VirtualHost *:80>
        <Directory /usr/local/xyzzy/webapps/wwwroot >
                Options Indexes MultiViews
                AllowOverride None
                Order allow,deny
                Allow from all
        </Directory>
        DocumentRoot /usr/local/xyzzy/webapps/wwwroot
</VirtualHost>

<VirtualHost *:80>
        ServerAlias api.xyzzy.com
        RailsEnv production
        DocumentRoot /home/webby/rails/current/public
</VirtualHost>

Answer 1

I think you're better off using the "default" virtual host (first defined) to solve this than a wildcard virtual host. You can swap the order and fill in the proper server name. This should case non-API hostnames to hit the default (first) vhost and anything matching API by hostname to hit the api vhost. Like so:

<VirtualHost *:80>
        ServerName www.xyzzy.com
        ServerAlias xyzzy.com
        <Directory /usr/local/xyzzy/webapps/wwwroot >
                Options Indexes MultiViews
                AllowOverride None
                Order allow,deny
                Allow from all
        </Directory>
        DocumentRoot /usr/local/xyzzy/webapps/wwwroot
</VirtualHost>

<VirtualHost *:80>
        ServerName api.xyzzy.com
        ServerAlias api.xyzzy.com
        RailsEnv production
        DocumentRoot /home/webby/rails/current/public
</VirtualHost>