Once we have created the certificate, we need a bridge between a secure endpoint and the current buckets. One of the most common ways to address this is by using CloudFront content distribution service. By using this, we'll make our website to be distributed to some (depending on the pricing) of the Amazon AWS edge locations, which means that if we have some international audience for our website, it will be served to the client by the closest edge location.
Creating WWW Distribution
First, on AWS Console select CloudFront from the services list, under Networking & Content Delivery category. Once there, click on Create Distribution button, in this case, we are interested in a Web Distribution, so under Web, select Get Started. In the create distribution form, there are some key values that are required to enter in order to make this configuration to work. The rest can stay with default value
- Origin Domain Name: www.abelperez.info.s3-website-eu-west-1.amazonaws.com (which is the endpoint for the bucket)
- Viewer Protocol Policy: HTTP and HTTPS (this way if anyone tries to visit through HTTP, it will be redirected to HTTPS endpoint)
- Price Class: Depending on your needs, in my case, US, Canada en Europe is enough
- Alternate Domain Names(CNAMEs): www.abelperez.info
- SSL Certificate: Custom SSL Certificate (example.com): and select your certificate from the dropdown menu
- Default Root Object: index.html
Note: If you can't see your certificate in the dropdown, make sure you've created / imported in the region N. Virginia.
Once entered all this information, click Create Distribution
Creating non-WWW Distribution
Let's repeat the process to create another distribution, this time some values will be different, as we'll point to the non-www bucket and domain name.
- Origin Domain Name: abelperez.info.s3-website-eu-west-1.amazonaws.com (which is the endpoint for the bucket)
- Viewer Protocol Policy: HTTP and HTTPS (this way if anyone tries to visit through HTTP, it will be redirected to HTTPS endpoint)
- Price Class: Depending on your needs, in my case, US, Canada en Europe is enough
- Alternate Domain Names(CNAMEs): abelperez.info
- SSL Certificate: Custom SSL Certificate (example.com): and select your certificate from the dropdown menu (the same as above)
- Default Root Object: leave empty, since this distribution won't serve any file.
Once entered all this information, click Create Distribution, the creation process will take about 30 minutes, so be patient. When they're done, the status changes to Deployed and they can start receiving traffic. You'll see something like this:
Updating DNS records
Now that we have created the distributions, it's time to update how Route 53 is going to resolve DNS requests to CloudFront distributions instead of the S3 bucket previously configured. To do that, on Route 53 console, select the Hosted Zone, then select one record set, and updated the Alias Target to the corresponding CloudFront distribution Domain Name. Then repeat the process for the other record set.
The following diagram illustrates the interaction between the AWS services we've used up this point. The browser first queries DNS for the given domain name, Route 53, will resolve to the appropriate CloudFront distribution, which can serve the content if it has already cached, otherwise it will request from the bucket and then serve the content. If the request is over HTTP to CloudFront, it will issue a HTTP 301 redirection to the HTTPS endpoint. If the request is over HTTPS to CloudFront, it will use the assigned certificate, which in this case is the same for both www and non-www endpoints.
< HTTP 301 - Redirecto to HTTPS
+----------------------------+
| |
| GET HTTP > +-----+------+ +----------------+
| abelperez.info | CloudFront | GET HTTPS | S3 Bucket |
| +--------> | (non-www) |-----------> | abelperez.info +--+
| | | | | | |
| | +------+-----+ +----------------+ |
| +-----+-----+ \ |
| | | V |
| +-> | Route 53 | (SSL certficate) |
| | | | A |
| | +-----+-----+ / |
| | | +------+-----+ +--------------------+ |
| | | | CloudFront |GET HTTPS | S3 Bucket | |
| | +--------> | (www) |--------> | www.abelperez.info | |
| | GET HTTP > | | | | |
| | www.abelperez.info +-----+------+ +----------+---------+ |
| | | | |
V | | | |
+--+--------+ <---------------+ | |
| | < HTTP 301 - Redirecto to HTTPS | |
| | <--------------------------------------------+ |
| Browser | < HTTP 200 - OK |
| | <--------------------------------------------------------+
+-----------+ < HTTP 301 - Redirect to www
One more step
There is a bucket that its sole purpose is to redirect requests from non-www to www domain name, this bucket was set to use HTTP protocol, in this case, we are going to update it to HTTPS, so we can save one redirection step in the process.
Let's test it
Once again, we'll use curl to test all the scenarios, in this case we have four scenarios to test (HTTP/HTTPS and www/non-www)
(1) HTTPS on www.abelperez.info - Expected 200
abel@ABEL-DESKTOP:~$ curl -L -I https://www.abelperez.info HTTP/2 200 content-type: text/html content-length: 79 date: Fri, 02 Feb 2018 00:57:25 GMT last-modified: Mon, 22 Jan 2018 18:58:47 GMT etag: "87fa2caa5dc0f75975554d6291b2da71" server: AmazonS3 x-cache: Miss from cloudfront via: 1.1 19d823478cf075f6fae7a5cb1336751a.cloudfront.net (CloudFront) x-amz-cf-id: 7np_vqutTogm9pKceNZ82Zim61Eb0E0D9fJBkFaqNHUz3LF63fEh2w==
(2) HTTPS on abelperez.info - Expected 301 to https://www.abelperez.info
abel@ABEL-DESKTOP:~$ curl -L -I https://abelperez.info HTTP/2 301 content-length: 0 location: https://www.abelperez.info/ date: Fri, 02 Feb 2018 01:00:11 GMT server: AmazonS3 x-cache: Miss from cloudfront via: 1.1 75235d68607fb64805e0649c6268c52b.cloudfront.net (CloudFront) x-amz-cf-id: 6WSECgHhkvCqZLW7kInopHnovCPcKU56oNQCZiCv7gaQLv2wSu-Vcw== HTTP/2 200 content-type: text/html content-length: 79 date: Fri, 02 Feb 2018 00:57:25 GMT last-modified: Mon, 22 Jan 2018 18:58:47 GMT etag: "87fa2caa5dc0f75975554d6291b2da71" server: AmazonS3 x-cache: RefreshHit from cloudfront via: 1.1 7158f458652a2c59cfcb688d5dc80347.cloudfront.net (CloudFront) x-amz-cf-id: _U7qobfP61P2aYyOakzzfwWjkKYrBeKObtWziPv7NVb5M3yPMlsbrQ==
(3) HTTP on www.abelperez.info - Expected 301 to https://www.abelperez.info
abel@ABEL-DESKTOP:~$ curl -L -I http://www.abelperez.info HTTP/1.1 301 Moved Permanently Server: CloudFront Date: Fri, 02 Feb 2018 01:00:32 GMT Content-Type: text/html Content-Length: 183 Connection: keep-alive Location: https://www.abelperez.info/ X-Cache: Redirect from cloudfront Via: 1.1 2c7c2f0c6eb6b2586e9f36a7740aa616.cloudfront.net (CloudFront) X-Amz-Cf-Id: qVYxI7z1DSVpzGrIfGWtHI8dZ1Ywx6dPUf4qGmtXbxl71IvC5R6P6Q== HTTP/2 200 content-type: text/html content-length: 79 date: Fri, 02 Feb 2018 00:57:25 GMT last-modified: Mon, 22 Jan 2018 18:58:47 GMT etag: "87fa2caa5dc0f75975554d6291b2da71" server: AmazonS3 x-cache: RefreshHit from cloudfront via: 1.1 6b11bd43fbd97ec7bb8917017ae0f954.cloudfront.net (CloudFront) x-amz-cf-id: w1YRlI4QR5W_bxXVXftmGioMCWoeCpwcCqlj0ucPlizOZVev22RU6g==
(4) HTTP on abelperez.info - Expected 301 to https://abelperez.info which in turn will be another 301 to https://www.abelperez.info
abel@ABEL-DESKTOP:~$ curl -L -I http://abelperez.info HTTP/1.1 301 Moved Permanently Server: CloudFront Date: Fri, 02 Feb 2018 01:01:00 GMT Content-Type: text/html Content-Length: 183 Connection: keep-alive Location: https://abelperez.info/ X-Cache: Redirect from cloudfront Via: 1.1 60d859e64626d7b8d0cc73d27d6f8134.cloudfront.net (CloudFront) X-Amz-Cf-Id: eiJCl56CO6aUNA3xRnbf8J_liGfY3oI5jdLdhRRW4LoNFbCMunYyPg== HTTP/2 301 content-length: 0 location: https://www.abelperez.info/ date: Fri, 02 Feb 2018 01:01:01 GMT server: AmazonS3 x-cache: Miss from cloudfront via: 1.1 f030bd6bd539e06a932b0638e025c51d.cloudfront.net (CloudFront) x-amz-cf-id: 7KfYWyxPhIXXJjybnISt25apbbHUKx74r9TUI9Kguhn2iQATZELfHg== HTTP/2 200 content-type: text/html content-length: 79 date: Fri, 02 Feb 2018 00:57:25 GMT last-modified: Mon, 22 Jan 2018 18:58:47 GMT etag: "87fa2caa5dc0f75975554d6291b2da71" server: AmazonS3 x-cache: RefreshHit from cloudfront via: 1.1 3eebab739de5f3b3016088352ebea37f.cloudfront.net (CloudFront) x-amz-cf-id: R8kB6ndn1K8YOiF6J2deG0QkHh-3QD65q0hfV5vdXm5-_1sNNlc3Ng==
No comments:
Post a Comment