have you tried to create a CNAME record?

yup but more confuse is, do i set it on vercel like cdn.example.com or aws side?

where is your domain hosted?

vercel

create it on vercel

created media CNAME cname.vercel-dns.com.

what is that?

like this

oo, i added here thats why they say create media CNAME cname.vercel-dns.com.

🫠

where is that?

you should add it in DNS records

i've added media cdn with bucket value

so if i visit media.example.com its saying 404 not_found

404: NOT_FOUND
Code: DEPLOYMENT_NOT_FOUND
ID: sin1::92c4p-1711068857287-e457b4043b0d

what is your bucket value?

hyperfuse-media-storage-aliyakhbar-mybucket-cecrctoa.s3-website-ap-southeast-1.amazonaws.com

could you show the record?

of the cname

nslookup media.example.com
and what do you see?

run it on terminal

-removed

look like it is set

so in my s3 static website hosting, i should point it to to media.xxx.com?

you have a site hosting on s3?

do i need to set anything on aws side?

no

this is your s3 bucket url right?

err base on what im reading they say i have to on this?

if i dont have to turn this on, then how do i get the url?

am i not suppose to use that + cloudfront?

how did you get this url?
hyperfuse-media-storage-aliyakhbar-mybucket-cecrctoa.s3-website-ap-southeast-1.amazonaws.com

from Static website hosting

i enabled it just now

and it creates a url for me

if i enable

it redirect me to other site

im confused 🤣

so what url do i have to put at vercel cname?

bucket url? but how do i get that?

choose host a static website

and put media.example.com to host name

is your hompage on index.html?

no, i got no page tho

i just wanna run a s3 bucket using a subdomain that is hosted at vercel

oh then you don't need to enable it

okay so i have hyperfuse.studio as my main site right ~

then i just wanna use media.hyp... as s3 bucket cdn?

yeah

so the thing is, what url do i put with media cname then

hyperfuse-media-storage-aliyakhbar-mybucket-cecrctoa.s3.amazonaws.com

this one

okay added

it should work

let me try

hmm how to fix the https thingy ?

I think you need to create a cloudfront distribution for your bucket

and set media.example.com as a alternative name

then change the value to the cloudfront address in DNS record on vercel

hmm okay, lemme try

but it will double the cost
the cost on cloudfront and the cost on vercel for bandwidth

whats the best solution

@Netherland Dwarf Use CloudFront on a private S3 bucket using OAC. Adding a custom domain to CloudFront is much easier, and it should even make you a free SSL certificate. https://docs.aws.amazon.com/AmazonCloudFront/latest/DeveloperGuide/GettingStarted.SimpleDistribution.html

This is how you can use a CNAME in Vercel DNS to point at your CloudFront distro https://docs.aws.amazon.com/AmazonCloudFront/latest/DeveloperGuide/using-https-alternate-domain-names.html

It does not make an SSL certificate automatically but you can request a free one from ACM to use with CloudFront. You basically just say you want to use SNI and choose the generated cert. https://docs.aws.amazon.com/acm/latest/userguide/gs-acm-request-public.html

The DNS verification is still pretty easy with Vercel DNS, you just add the verification records it tells you to

The price is not even bad, data egress from S3 to CloudFront is free! https://aws.amazon.com/s3/pricing/

@Asian black bear in your opinion should i use WAF when creating distribution?

@Netherland Dwarf for your case I think maybe the WAF wouldn't have much to do, there is not really a web app or anything to hack on your S3 origin

hmm make sense, then i can turn it off cause i saw while i was testing im getting charged $5 + for waf

so i've finally able to create ACM, im trying to assign the acm to my cloudfront now

yeah, definitely not worth that. It is more for if you have like a wordpress site behind cloudfront and it will try to filter out common/known exploit traffic

everything in AWS is really a headache

yes 😦

so basically

on vercel side, i just need to create cname pointing to s3 bucket url

then create cdn for that bucket

then im good to go?

so yeah, you get the ACM cert for like cdn.yoursite.dev

then in vercel make the cname for cdn -> 1234543.cloudfront.net

and tell the cloudfront distro to use the ACM cert for requests from your custom domain

the main (and non-negligible) risk of using AWS is that there is not way to set a hard upper limit on budget

One kind of legit attack is to use a botnet to just like download a bunch of crap from your CDN and run up the bill

im confused again AHHAA

so we have this

yeah that is not right

^ on vercel

i need to add d146bq8hgj23er.cloudfront.net too?

exclusively

delete the url for the s3 bucket

wait 60 seconds... profit?

delete the cname for media

okay

so i add new one, media > cname > cloudfront url?

yeah

exactly

I have an application with a lot of images in S3 and use twicpics as the cdn instead of cloudfront

it has a handy url scheme for resizing/compressing images

whats your recommendation tho

i just wanna store

its ok, I know how to use cloudfront & s3 for a reason too

it works now!

there you go!

i read too many tuts/docs on this with 0 leads

🤣

AWS can be really frustrating

friendly life advice: if you ever consider using S3 object lambdas please seriously consider an image CDN instead ☠️

you lost me at object lambdas 🤣

they are a kind of... the raw materials to process media before serving it, just not convenient

will take note on this!

it can be handy to store the size of images in the filename if you don't keep the size anywhere else

because your image component can always parse the sizes out and do stuff like have the right aspect ratio

without making a fetch

The Storyblok CDN encodes the original dimension info the URLs it provides https://a.storyblok.com/f/39898/3310x2192/e4ec08624e/demo-image.jpeg/m/

but you can fake it using names (ahem, keys) of files in S3

alright I am off to bed, good luck!