Accessing AWS S3 via CloudFront on the Web

Here's how you can set it up:

1. Go to Ama­zon S3 and Create bucket, let's say the name is bucket-test.

2. Keep Block all public access on, and cre­ate the buck­et.

3. Op­tion­al. Con­fig­ure the buck­et for sta­t­ic web­site host­ing: en­able sta­t­ic web­site host­ing in the buck­et's prop­er­ties and set up your in­dex and er­ror doc­u­ments.

4. Go to Ama­zon Cloud­Front > Dis­tri­b­u­tions and Create distribution, let's say the name is serve-bucket-test.

• Step 1 Get start­ed:

  • Sin­gle web­site or app,
  • Press Next and skip the do­main con­fig­u­ra­tion for now.

• Step 2 Spec­i­fy ori­gin:

  • Ori­gin type: Ama­zon S3,
  • In the Ori­gin sec­tion, click Browse S3 and choose the buck­et,
  • Op­tion­al­ly se­lect the path (sub­fold­er) that will be served to the pub­lic,
  • Make sure the op­tion Al­low pri­vate S3 buck­et ac­cess to Cloud­Front - Rec­om­mend­ed is en­abled,
  • Press Next.

• Step 3 En­able se­cu­ri­ty: It is a mat­ter of your choice to use WAF or not. In this case, I'm in­tend­ing to serve only im­ages (pic­tures) from the buck­et, so I'm choos­ing Do not en­able se­cu­ri­ty pro­tec­tions.

• Step 4 Re­view and cre­ate: re­view the se­lect­ed pa­ra­me­ters and press Cre­ate dis­tri­b­u­tion.

5. At the Dis­tri­b­u­tion page, choose Add domain:

• Step 1 Con­fig­ure do­mains: for the do­main to serve, en­ter your real FQDN real.domain-name.com.
• Step 2 Get TLS cer­tifi­cate:
  • The ser­vice will pro­vide a Name/Val­ue pair for a CNAME record,
  • Cre­ate the DNS record in your DNS provider, dis­able any proxy op­tions if there are any, and set the TTL to 1 min,
  • Wait a while un­til the cer­tifi­cate is val­i­dat­ed, then click Next.
• Step 3 Re­view changes: if every­thing looks okay, press Add do­main.

6. At the Dis­tri­b­u­tion page, now you need to se­lect Route domains to CloudFront. It will ask you to cre­ate A and AAAA records that point to a FQDN in­stead of an IP ad­dress, which is not al­lowed by most DNS providers. If that is your case, just cre­ate a CNAME record in­stead of these.

7. Now you can up­load some-test-image.jpg to your buck­et and try to ac­cess https://real.domain-name.com/some-test-image.jpg. Note: if you se­lect­ed a path (sub­fold­er) with­in the Cloud­Front set­up, you will need to up­load the im­age to that fold­er, but ac­cess it via the root path in the web.