When BunnyCDN returned 502 Bad Gateway for optimized images and the origin header rewrite that fixed passthrough

Web developers know the thrill of optimizing a website. You’re squeezing out every millisecond of performance. Then—bam! A wild error appears: 502 Bad Gateway. This is a short story about how BunnyCDN broke image delivery for optimized images and how an origin header rewrite saved the day.

TL;DR:

• BunnyCDN suddenly returned 502 Bad Gateway errors for optimized image requests.
• Normal images loaded fine, but optimized versions failed silently.
• The issue was rooted in how the headers were sent to the origin server.
• Rewriting the Origin header in BunnyCDN fixed the problem and restored the magic.

What Happened Exactly?

You’re running a fast site powered by BunnyCDN. You’re even using its fancy Image Optimization feature. It works like this: BunnyCDN grabs the original image from your server, compresses it, resizes it, and then delivers the adjusted file based on user needs—like smaller pics for phones and web-friendly formats like webp.

Suddenly, one day, optimized images stop working. Clicking around or checking your dev console shows a bunch of 502 Bad Gateway responses. Uh oh.

Interestingly, this didn’t affect all images. Only the optimized ones. The regular, original images still loaded fine! So, you dig deeper.

Understanding the 502 Mystery

A 502 Bad Gateway error means that BunnyCDN tried to fetch something from your origin server but failed. The server didn’t give back a proper response. This often happens due to:

• Server being offline or overloaded
• Firewall blocking BunnyCDN bot or IP
• Weird caching or rewrite issues
• Wrong or malformed headers

But your server is up. The IPs are whitelisted. Non-optimized images work—you even curl them just to be sure. Then, another thought hits you: The problem must be something different with optimized image requests.

Optimized vs Unoptimized Requests

Bunny’s image optimizer sends special requests to your server. It appends query strings, like:

/images/sample.jpg?width=800&format=auto

This tells Bunny to grab the image, convert it, and serve it in the best format possible. But there’s more happening in the background.

While looking at your logs or enabling debug mode, you notice the image optimizer is not only changing the URL, it’s also sending extra headers—including the Origin header.

Wait, what’s that Origin header? It’s used in CORS (Cross-Origin Resource Sharing), telling the server who’s making the request. And sometimes, it causes problems—especially if the server doesn’t expect it.

BunnyCDN and Origin Header Shenanigans

It turns out BunnyCDN was forwarding the wrong Origin header when trying to proxy these optimized image requests back to your origin server. Your server, seeing an unfamiliar origin, refuses to send the image. Some servers even respond with an error. Hence—502 Bad Gateway.

This behavior wasn’t documented well, and it took a lot of trial and error for some devs to figure it out. BunnyCDN never clarified why it started sending the Origin header in a way that broke passthrough. Still, here we are.

The Magic Fix: Rewrite Origin Header

BunnyCDN allows you to manipulate headers before sending requests to your origin. This is like putting on a disguise. You tell Bunny: “Hey, rewrite the Origin header so the server thinks everything is normal.”

Here’s how to do it:

1. Log in to your BunnyCDN dashboard
2. Go to the Pull Zone for your site
3. Click on Request Header Rules
4. Add a new custom rule:
   • Condition: Always
   • Header Name: Origin
   • Header Value: Your actual server’s domain (e.g., https://example.com)
5. Save the changes

Once this rule is in place, BunnyCDN rewrites the origin header to match what your server expects. No more weird cross-origin trickery. And best of all—the 502s vanish like they never existed.

How Long Did It Take?

Some developers tracked this issue for days. Others raised support tickets with BunnyCDN and got vague responses. The real fix only happened once someone pieced together that the Origin header was the culprit.

In fact, this issue acted like a secret bug. Everything else on the site worked—just not images with optimization. And only when the server had strict CORS or header handling policies. That made it even harder to detect.

Lessons Learned

• Headers matter: Small changes in HTTP headers can break entire services.
• CORS is sneaky: Even if you’re not doing cross-origin requests in JavaScript, the underlying systems might be.
• Read your logs: Server error logs, CDN response diagnostics, browser dev tools—they all help you glue the puzzle together.
• Use CDN features wisely: The more magic your CDN does, the more complex debugging becomes. Break things into smaller parts when errors occur.

What Can BunnyCDN Do Better?

To be fair, BunnyCDN is an awesome service. It’s fast, cheap, and does a lot right. But:

• They didn’t document this origin header behavior clearly.
• There was no obvious alert to the change.
• The error response didn’t explain what went wrong.

A simple suggestion in the dashboard could have saved hours. Something like: “Your origin may be rejecting requests due to header configuration. Try rewriting the Origin header!”

Conclusion

Optimizing images with BunnyCDN is cool—but not when you’re hit with mysterious 502s. Thankfully, by rewriting the Origin header, you can trick your stubborn server into playing nice again. Problem solved! Next time you see a 502 from a CDN, don’t panic—check the headers.

And now you know. Rewrite your origin. Save your images. Look like a hero.

Happy tweaking!