Accessing EC2 public IP address via the Subdomain

For resolving Same Origin Policy Error and 403 Cookie Header Error

ยท

3 min read

Accessing EC2 public IP address via the Subdomain

๐Ÿ”ฐ 1. Purchasing a domain and setting up subdomains on Gabia

  1. Purchase a domain through Gabia.

  2. In the DNS record settings, add two records: A type and CNAME type.

  • CNAME: If our intended subdomain name is api.broccoli-market.store, put the part before the dot (.) in the host section, and put our actual domain name in the value/location. Note that the dot (.) should be appended to the end of the domain.

  • A: Put the actual AWS EC2 Public IP address that we want to connect to.

  • TTL (Time To Live): It represents the lifespan of the DNS record cached between browsers and servers. The higher the value, the longer the DNS record will be cached. Typically, a value of 3600-7200 seconds is used.

๐Ÿ”ฐ 2. Setting up subdomains on AWS Route 53

  • In our project, we deployed the frontend server to AWS S3. The S3 deployment URL is not an IP address but something like http://broccolimarket.s3-website.ap-northeast-2.amazonaws.com/, so we cannot directly put it in the value/location on Gabia. We need to connect the S3 bucket to the domain through AWS Route 53. Here is a guide on how to connect AWS S3 to a domain.

  • In the hosting zone where we deployed the frontend with the main domain address, add A type and CNAME type records.

    • Use the api that we put in the host name field on Gabia as the record name.

    • Put the Public IP address of the backend server deployment in the value field.

    • Set the TTL to the same value as before.

(Not sure if it is necessary to set up the subdomain of the backend server on AWS Route 53, but I did it this way and it worked well.)

๐Ÿ”ฐ 3. Installing Nginx on EC2 instance

  • Nginx is a proxy server that handles static file serving, dynamic content processing, load balancing, and SSL/TLS encryption support. We will install Nginx on our EC2 instance and specify our subdomain in it since we plan to convert HTTP to HTTPS later on, and Nginx provides additional features.
  1. Connect to the AWS EC2 instance via SSH.

  2. sudo su: Switch to the root user.

  3. apt update

  4. apt install nginx: Install Nginx.

  5. Add an inbound rule for HTTP in the AWS security tab's inbound rules.

  • After completing these steps, Nginx is installed. Now let's specify the subdomain in Nginx.
  1. In the SSH terminal, enter `vim /etc/nginx/sites-available

/default. ![](https://velog.velcdn.com/images/c1madang/post/b2289f1f-9b28-402c-b5fb-57b9d714df4a/image.png) When the editor opens, scroll down until you find _in theserver_namesection. Replace it with our subdomain name. Also, since we are using Nginx as a proxy server, specify theproxy_passvalue as our backend deployment Public IP address. ![](https://velog.velcdn.com/images/c1madang/post/ddc1e953-d080-4960-8943-9e2505f77cfa/image.png) - Theproxy_passdirective specifies which server to pass requests to when users access theapi.broccoli-market.store` subdomain path. We need to put our deployment IP address there.

  1. nginx -t: Check for any syntax errors in Nginx configuration.

  2. service nginx restart: Restart Nginx.


Once these steps are completed, we should be able to access our EC2 deployment via the subdomain!

ย