Advanced Users looking for just the solution, skip to the An Overview section.

The goal of this post is to display how one can run multiple dynamic websites on one machine, and serve different ones based on the domain your server is being accessed through.

Objectives

• Teach you how to use the ProxyPass and ProxyPassReverse with Apache
• Provide a reusable template configuration for mapping domains to websites

What you'll need

• Dynamic Websites and Different Domains for your sites. With your domains all pointing to your machine's IP Address through an A Record. This process varies per host and requires some own research.
• A machine with Linux running on it, I'll be using ubuntu 20.04 throughout this tutorial
• Basic knowledge of HTTP and Ports.

The Process

Let's say I have two websites,

• shop.theonlywayup.live - Amazon Clone
• twitter.theonlywayup.live - Twitter Clone

Both of these are websites that need to have a backend server running to work. They need to manage logins, shop items, posts, etc. Hence they're both dynamic websites.

About HTTP

When you access a website, your browser connects to my computer on port 80 and requests information. As only one application can use a port at a time, you can start to see the problem. What if I have two websites I need to run?

To alleviate this, we use something known as a reverse proxy. We move the websites to other ports and run the proxy on port 80. For the sake of this example, let's take

• shop.theonlywayup.live - localhost:5000 (Running on port 5000)
• twitter.theonlywayup.live - localhost:8000 (Running on port 8000)

When your browser talks to my computer, it tells the reverse proxy the name of the website it's trying to talk to (shop.theonlywayup.live). The proxy establishes a connection between your client and my app running on port 5000.

Briefly, The reverse proxy proxies communications between a client and a server based on the domain name the client is connecting to.

Setting up your machine

To get this working, we'll need to install apache2.

sudo apt update
sudo apt install apache2

Visit your server's IP Address to ensure apache is running, you should see something like

Now, we need to edit the default configuration of apache2.

cd /etc/apache2/sites-available/

Takes us to the directory this file is in, first we need to empty it of its contents

true > 000-default.conf

This empties the file, then we need to replace it with our hosts

nano 000-default.conf

Once the window opens, edit this template to your requirements and paste it in,

<VirtualHost *:80>
    ProxyPreserveHost On
    ProxyPass / <server_url>
    ProxyPassReverse / <server_url>

    ServerName <domain_name>
</VirtualHost>

Our config for this example looks like

<VirtualHost *:80>
    ProxyPreserveHost On
    ProxyPass / http://localhost:5000
    ProxyPassReverse / http://localhost:5000

    ServerName shop.theonlywayup.live
</VirtualHost>

<VirtualHost *:80>
    ProxyPreserveHost On
    ProxyPass / http://localhost:8000
    ProxyPassReverse / http://localhost:8000

    ServerName twitter.theonlywayup.live
</VirtualHost>

Before we can deploy this, we need to enable a few plugins. We can do this by running the a2enmod command and pasting proxy proxy_ajp proxy_http rewrite deflate headers proxy_balancer proxy_connect proxy_html when it prompts us, this enables the above plugins.

a2enmod
proxy proxy_ajp proxy_http rewrite deflate headers proxy_balancer proxy_connect proxy_html

OR

a2enmod proxy
a2enmod proxy_http
a2enmod proxy_ajp
a2enmod rewrite
a2enmod deflate
a2enmod headers
a2enmod proxy_balancer
a2enmod proxy_connect
a2enmod proxy_html

Now, the last step, restart apache2 and watch our domains start working :) service apache2 restart

---

An Overview

Run

sudo apt update
sudo apt install apache2
cd /etc/apache2/sites-available/
a2enmod
proxy proxy_ajp proxy_http rewrite deflate headers proxy_balancer proxy_connect proxy_html
true > 000-default.conf
nano 000-default.conf

This installs apache, enters the config directory, enables a few plugins, empties the config file, and opens it for you to edit.
Modify the below template to suit your needs

<VirtualHost *:80>
    ProxyPreserveHost On
    ProxyPass / <backend_server_url>
    ProxyPassReverse / <backend_server_url>

    ServerName <domain_name>
</VirtualHost>

You can paste this block again to add a proxy for another domain. At the end of this blog, our config looks like

<VirtualHost *:80>
    ProxyPreserveHost On
    ProxyPass / http://localhost:5000
    ProxyPassReverse / http://localhost:5000

    ServerName shop.theonlywayup.live
</VirtualHost>

<VirtualHost *:80>
    ProxyPreserveHost On
    ProxyPass / http://localhost:8000
    ProxyPassReverse / http://localhost:8000

    ServerName twitter.theonlywayup.live
</VirtualHost>

Restart apache2 to see your config in action :)

service apache2 restart

---

The End

That's the end of this blog post. This issue has been a thorn in my side for a while, and I'm happy I was able to fix it and share the solution with you all :)

github.com/TheOnlyWayUp

If you liked this post, I would appreciate it if you could drop a follow on my Github profile :)