Im still getting massive amounts of bandwidth usage

[MojoPH]

I’ve got a simple grocery shopping website and I setup Cloudflare from the start expecting it would reduce the bandwidth hit.

It’s still a growing site and i dont have much history to compare to but looking at it now, halfway thru the month and i’ve already hit 77GB bandwidth from my package/plan of 10GB only!

1. I checked Cloudflare and yes it’s setup right… CF claims to have saved me X bandwidth
2. 99% of stuff on the server are just images (product images) and these are static for sure.
3. 99.99% of users are local in my City only.

consumption shows that half of the BW hits are the static images!

These again are static and should’ve been cached on CF already right? and that all other users in the same region/location/city should be accessing cached images from CF right? and not from my server directly? hence the geographical “content distribution” where users from same areas will be served cached data from closest server of CF, right?

Then why am I still getting so BW hits?

[freitasm]

These should be cached BUT if your server is misconfigured and sends out a header to no-cache then Cloudflare will respect that.

I suggest checking on Dev Tool (from your browser) or use Online API Testing Tool | Test Your API Online (reqbin.com) directly to the server to see what headers are being sent out.

[MojoPH]

tnx for confirming

I loaded the main page where the products are displayed from… and it does say this

But the actual images (html code for it) are dynamically generated after Ajax call to API containing all the products w/ link to their respective images …

1. are these affected?
2. and isnt this no-cache setting for the browser? and that, regardless , Cloudflare should be caching the images on their servers right? Doesn’t have anything to do w/ browser deciding to cache it or not

[freitasm]

Understanding Origin Cache-Control – Cloudflare Help Center

" * no-store — Indicates that any cache (ie a client or proxy cache) must not store any part of either the immediate request or response."

[MojoPH]

ok i see

i went thru the link and i think i get it now. But im confused which part of my website i should cache

So that screenshot i showed earlier is from the parent page where the products are shown
“shop.php”

That page loads up first, and then fires the get_products AJAX function … loading JSON of products from the API

“api.php?action=get_products”

… the page (JS) then builds the rows of HTML code that displays each products like:

product 1

product 2

…etc

Now, i thought this current no-cache, no-store is fine because it is for the main page shop.php which i dont want cloudflare to cache … i want the freshest shop.php page to load always since i change this frequently.

What i need is just for cloudflare to cache the images … and i checked the headers for each image and it seems to be set alright

shouldn’t this current setup work already? or do i have to allow caching on the main page “shop.php”?

again, i dont want shop.php to be cached
i want the images in that page to be cached.

[freitasm]

I don’t see a CF-Status in the response header. Can you see one?

[MojoPH]

on which one are we talking about, the response on the parent web page “shop.php” or on each images loaded into that page?

[freitasm]

For the images.

[MojoPH]

I ran the page through web page test and in the CDN part of the test it said

and here’s the response headers for one of the images (all loaded in the same fashion)

[freitasm]

This screenshots shows “cf-cache-status: HIT” while the previous one didn’t have this header. So something changed or the image in the previous screenshot wasn’t used before.

The cache is loaded when an image is used but if there are no requests for that resource it will be evicted from the cache.

Images that are used more than others will last longer in the CDN cache.

[MojoPH]

I see thanks for the clarification. So i guess some images were evicted and needed to be loaded from origin server again.

But my site is pretty active and i dont know why i’d end up with such huge bandwidth on origin server… like CF is missing so much of the data.

Is it possible that I needed EDGE CACHE thing on? I’m still confused about edge cache… i thought CF by default (no Edge Cache setting) caches static content for anyone within my location as long someone’s already visited it - the next visitor wouldn’t need to load data from origin server as CF will serve its cached content to them.