Disappointed you can't make an origin URL for the subdomains

[nick7]

I’ve been using another CDN service for almost 4 years. CloudFlare pushed hard with the hosting provider I use to have us use CloudFlare as part of their “Bandwidth” alliance. Now after all this setup with Cloudflare, CloudFlare basically declared I’m going to have to have 4 million links updated to have brand new URLs.

The reason why? Because I cannot hide a directory.

My CDN is set up right now to pull files from cdn.example.com/file.jpg now with Cloudflare, apparently that has to become cdn.example.com/file/example/file.jpg way longer, and breaks millions of links. Problem is we hotlink a lot of our images so cdn.example.com/file.jpg is displaying perfectly fine on our old CDN. If it’s on CloudFlare it will be broken because the real location is example.com/file/example/file.jpg and the cdn just cloaks it with cdn.example.com/file.jpg

Basically:

• Real URL is example.com/file/example/file.jpg
• Current CDN Origin is: example.com/file/example/
• Current CDN subdomain is: cdn.example.com
• CDN displaying image: cdn.example.com/file.jpg
• with Cloudflare: cdn.example.com/file/example/file.jpg

What I want: I want to be able to use cdn.example.com/file.jpg just fine with CloudFlare.

I am even willing to pay for a plan to get origin URL cloaking as a feature and working like how MaxCDN, BunnyCDN, CDN77, LimeLight, Akamai, CacheFly, KeyCDN, StackPath, Cachefly… CloudFlare is alone in not offering this it seems.

Makes me sad.

[sdayman]

You can write a Worker to pull certain requests from a different URL. So you can create a ‘cdn’ subdomain and add a Worker that pulls any ‘cdn’ subdomain requests from your CDN Origin.

https://gist.github.com/lfjeff/cca9797f09acfba2140f95d8594df76d

It’s possible to search/replace URLs on the fly from your site using a Worker, but I wouldn’t count on it working for requests initiated by JS. Just delete the Inject Scripts routine:

Perform regex replacements and inject CSS/JavaScript with Cloudflare Workers

I was surprised there’s no recipe for this, so I wrote the snippet below: addEventListener('fetch', event => { event.passThroughOnException() event.respondWith(handleRequest(event.request)) }) /** * Fetch and log a given request object * @param {Request} request */ async function handleRequest(request) { const response = await fetch(request) var html = await response.text() // Simple replacement regex html = html.replace( /Source Phrase/g , 'Target Phrase') // Inject scripts const…

[nick7]

Okay! Your words were the magic I needed to find this: https://jross.me/free-personal-image-hosting-with-backblaze-b2-and-cloudflare-workers/ Someone wrote one for B2

Edit: Worked flawlessly.