How to configure a reverse proxy in AWS?
Tags: angular, multiple, reverseproxy, react
Published: 2020-04-27 06:13:40

---
title: How to configure a reverse proxy in AWS?
published: true
date: 2019-10-19 09:42:55 UTC
tags: angular,multiple,reverse-proxy,reactjs
canonical_url: https://medium.com/commutatus/how-to-configure-a-reverse-proxy-in-aws-b164de91176e
---

![](https://cdn-images-1.medium.com/max/1024/1*RtN9xkQOPrkDDwitDp7oCA.jpeg)<figcaption>Setting up reverse proxy in aws.</figcaption>

Ever tried setting up multiple web applications under the same domain? Where users can access applications running on the same server with different path names? For instance, you hosted a react app at [www.example.com](http://www.example.com) and desire to have a Wordpress blog at [www.example.com/blog](http://www.example.com/blog). This is where the concept of reverse proxy kicks in and helps you accomplish what you are looking for.

#### What’s a proxy and the difference between the forward & reverse proxy?

A simple definition for “proxy” means that data is passing through a third party, before reaching to the actual location. Forward or regular proxies are servers that encapsulate the original identity of the requestor i.e., users stay anonymous to the host server.

![](https://cdn-images-1.medium.com/max/810/1*113GbW_Ec_A50YDoa4HyQA.jpeg)<figcaption><a href="https://www.imperva.com/learn/performance/reverse-proxy/">Forward Proxy</a></figcaption>

Reverse proxy as the name suggests does the opposite of what a forward proxy can do. It takes requests from the user and forwards them to the host web servers acting as a load balancer. We can leverage this behaviour to serve different apps under the same hood.

![](https://cdn-images-1.medium.com/max/810/1*gjlo1NiNk_uWiLGb8GD8Aw.jpeg)<figcaption><a href="https://www.imperva.com/learn/performance/reverse-proxy/">Reverse Proxy</a></figcaption>

> To summarise, the forward proxy hides the clients whereas a reverse proxy hides the servers.

#### Enough of theory, let's get to work!

![](https://cdn-images-1.medium.com/max/1024/0*rOhDYJWnVwJpb-K_)<figcaption>Photo by <a href="https://unsplash.com/@aligns?utm_source=medium&amp;utm_medium=referral">Jordan Harrison</a> on <a href="https://unsplash.com?utm_source=medium&amp;utm_medium=referral">Unsplash</a></figcaption>

#### How to configure a reverse proxy in AWS?

Before we move onto configuration, make sure your web application is deployed to **AWS elastic beanstalk**. If it’s not, check out this article ( [Easy steps to deploy a node application on AWS](https://medium.com/commutatus/deploy-angular-application-on-aws-elastic-beanstalk-part-1-2-cf6419728c25) ).

#### Step: 1

Go to your EC2 instances from the AWS console.

![](https://cdn-images-1.medium.com/max/1024/1*XL6EXNuZI7ZmyuQROe3X1w.png)

#### Step: 2

Scroll to the bottom and click on **Load balancers** to check if your instances are in an active state.

![](https://cdn-images-1.medium.com/max/1024/1*ugGGkBNtaDj9okDT3GLI6Q.png)<figcaption>Choose Load Balancers in EC2</figcaption>

![](https://cdn-images-1.medium.com/max/1024/1*12b1Mx63DivnR25vBrFdcg.png)<figcaption>Load balancers in Active State</figcaption>

#### Step: 3

Create a Target Group for your instance

![](https://cdn-images-1.medium.com/max/1024/1*HMbT5Fd5Q6UA_BcydcIn8g.png)<figcaption>Create a Target Group</figcaption>

#### Step: 4

Name your target group and click ‘ **Create** ’. Default settings are fine here.

![](https://cdn-images-1.medium.com/max/1024/1*Zs-uLlCGd_5iXqNKV8rfRg.png)<figcaption>Naming your target group</figcaption>

#### Step: 5

Select the target group you just created and click ‘ **Edit** ’.

![](https://cdn-images-1.medium.com/max/1024/1*d-u-0uWgB3FM_EgPT2LvYA.png)<figcaption>Editing the target group</figcaption>

#### Step: 6

Select a running instance you want to register with your target group (in this case, it's a WordPress blog) and click **‘Add to registered** ’.

After it shows up in the Registered targets, click on ‘ **Save** ’

![](https://cdn-images-1.medium.com/max/1024/1*Cvym9Wm7ARq93NmZSoOAMQ.png)<figcaption>Registering our instance with the target group</figcaption>

#### Step: 7

Now, go back to your load balancers and select the one you want to proxy. Click on Listeners tab and click on “ **View/edit rules** ” of the HTTPS: 443 listener you configured while [setting up SSL](https://medium.com/commutatus/configure-ssl-in-elastic-beanstalk-application-part-2-2-f1c20e3f562f).

![](https://cdn-images-1.medium.com/max/1024/1*EX7LS0qmOTLELQsQehgRjQ.png)<figcaption>Editing listeners for reverse proxy</figcaption>

#### Step: 8

Tap on the + icon and click “ **Insert Rule** ”

![](https://cdn-images-1.medium.com/max/1024/1*FkC1TXIYAW1_iFnJEQIMrw.png)<figcaption>adding forwarding rules</figcaption>

#### Step: 9

Add the following 2 rules to proxy the blog server every time a user hits the blog path:

> IF Path is /blog THEN Forward to example-blog

> IF Path is /blog/\* THEN Forward to example-blog

![](https://cdn-images-1.medium.com/max/1024/1*9U_GgFRsiB_WJdm5-fpCQg.png)<figcaption>rules to reverse proxy blog</figcaption>

#### Step: 10

Let’s see this in action!

![](https://cdn-images-1.medium.com/max/600/1*l71wEiuvxGyFbHS00J8YUw.gif)<figcaption>Reverse proxying /blog path</figcaption>

Give an 👏 if this article was helpful and leave your queries in the comments section below.

* * *