High Availability Architecture of a Web Server using EBS, S3 & CloudFront on AWS

In this blog, I am going to explain how to create a High Availability Architecture with AWS CLI. The architecture should include a web server (Apache) running on EC2 and the document root (/var/www/html) should be made persistent by mounting on EBS Block Storage.

Static objects should be placed inside S3 and Content Delivery Network should be setup using CloudFront with the domain as an S3 bucket. Finally, we have to put a webpage with CloudFront URL in /var/www/html for security and low latency.

✔️ Prerequisites:

Before doing this practical you should know some basics of AWS CLI. You should know how to launch EC2 instance, EBS volume, and S3 using AWS CLI. You can refer to my blog on AWS CLI 👇 👇

https://adyraj.medium.com/aws-command-line-interface-cli-69630827d6a4

Now let’s understand about CloudFront.

CloudFront: Amazon CloudFront is a fast content delivery network (CDN) service that securely delivers data, videos, applications, and APIs to customers globally with low latency, high transfer speeds, all within a developer-friendly environment.

So first, we need to launch one ec2 instance on AWS using CLI. So let do this with the command.

aws ec2 run-instances

— image-id ami-038f1ca1bd58a5790

— count 1

— instance-type t2.micro

— key-name mykey

— security-group-ids sg-a5a4c183

— subnet-id subnet-7707d411

— tag-specifications=ResourceType=instance,Tags=[{Key=Name,Value=instance1}]

Here “aws ec2 run-instances” is a command to launch an ec2 instance by providing different options like image id, key-name, security-group-id, etc. So the above command will launch one ec2 instance with Name instance.

Now let’s launch one elastic block storage using AWS CLI and for that, we can use the “aws ec2 create-volume command”

aws ec2 create-volume

— availability-zone us-east-1a

— size 1

— volume-type gp2

— tag-specifications=ResourceType=volume,Tags=[{Key=Name,Value=WebEBS}]

Here we are providing the availability zone where this volume needs to be created and finally, it will create a volume with the tag WebEBS.

Now as the volume is created so we need to attach this volume with ec2 instance and for this, we need to use “aws ec2 attach-volume” command

aws ec2 attach-volume

— volume-id vol-0bd8a562fef9d117c

— instance-id i-0e74a3bbbeabac766

— device /dev/sdf

This command will attach the volume with the instance. We can confirm by running “fdisk -l” from the instance.

Now according to our practical we need to install an Apache web server and then we have to make the document root ( /var/www/html ) permanent by mounting it to the block storage. So let’s first install apache webserver.

The above command will install an Apache webserver ( httpd ) and will also create the default document root for httpd.

Now we have to make the document root of Apache webserver ( httpd ) permanent so first let’s create one partition in the block storage ( /dev/xvdf ) with ext4 format type and then we will mount it with the document root.

We have created the partition we can verify with “lsblk” command.

We can see that one new partition of 954M is created named xvdf1. Now we need to format the partition xvdf1 with ext4 format type. For that, we can use “mkfs.ext4 xvdf1” command.

mkfs.ext4 xvdf1

Now we need to mount this partition with /var/www/html directory and for this we can use “mount /dev/xvdf1 /var/www/html”. After that, we can verify with the “df -h” command.

mount /dev/xvdf1 /var/www/html

Now we can create an S3 bucket to put all static objects in it and then we will use it on our web page. So, let's create an S3 bucket with “aws s3api create-bucket” command.

aws s3api create-bucket

— bucket task-web-bucket

— region us-east-1

So an S3 bucket will be created with the name called task-web-bucket. We can verify this from the AWS management console.

As a bucket is created so now we can upload the static object with the help of “aws s3 cp” command.

aws s3 cp aws_img.jpg s3://task-web-bucket

— acl public-read

I am uploading one image called batman.jpg into the S3 bucket with permission called public-read so that anyone from the internet can read it.

As the object is successfully uploaded into S3 so now we can use it on our web page we just require the URL. Which we can get from the properties of objects.

Now we can use the Object URL in our HTML code to deliver this content to the users. So let’s create one HTML code that contains the Object URL.

Now we can start the service of Apache webserver (httpd) so that any client can visit our website.

These are typical Linux commands to start and enable the service but the important thing is that now any user can access my website with the Public IP Address of the ec2 instance.

Here we can see that the webpage is available with one static object. And the interesting thing is that the static object( image ) is coming from the S3 bucket and the HTML code is kept in EBS volume. So if the instance will go down or terminate then we will not lose our data.

Everything seems to be perfect in this architecture but the only problem is that in my case the instance is launched in North Virginia Data Center so the client from N. Virginia or near to it can easily get the static object without any latency. But suppose if there are some users from India then they will face some latency as the static object (image) is stored in N. Virginia. So to provide content to the users with low latency and high availability we can use Content Delivery Network. So that the static object will be stored in the near data center of the user when any first user will request for it.

AWS CloudFront is one of the services which provides the CND feature. We can give the URL of our S3 object to CloudFront and whenever client will request the Object first the request will go to their near edge location of the data will be there and they will get it and it’s called hit and if it will be not there then it’s called miss and first the data will be copied and then will be given to the client.

So let’s create CloudFront Distribution to set up a fast content delivery network (CDN) service that securely delivers data, videos, applications, and APIs to customers globally with low latency, high transfer speeds.

For this, we have to use the “aws cloudfront create-distribution” command and also we need to provide the URL of the S3 bucket as origin-domain-name.

aws cloudfront create-distribution

— origin-domain-name https://task-web-bucket.s3.amazonaws.com

Let’s check from AWS Management Console that CloudFront Distribution is created.

Now we can use the Domain Name provide by CloudFront Distribution in our HTML code to provide SDN facility to clients.

Let’s put this CloudFront Distribution domain name in HTML code to access the static object.

Now if any user who is not from N. Virginia or nearby will visit the webpage then first their request for Static object will go to their near edge location and if the Object will we there they will get it very fast otherwise first that object will be cached in the edge location.

Hope you enjoy reading this blog for more interesting technical stuff connect me on LinkedIn 👇 👇

Thank You for reading !! 🤗 🤗