Hi everyone , I have a problem with rendering transformed images via cloudflare in my nextjs application.

I'm using Next.js (v14.2.14) App Router with images served through Cloudflare Images Transformation. My image URLs are in the following format:

https://{my-domain}/cdn-cgi/image/width=100/https:/%7Bs3-bucket-name%7D.s3.%7Bregion%7D.amazonaws.com/[image-path]/image.jpg

Problem: When trying to load these images, Next.js is treating the /cdn-cgi portion of the URL as a page route, resulting in a 404 Not Found error instead of loading the image properly.

My setup:

Next.js App Router
Images hosted on AWS S3
Using Cloudflare Images for image optimization and transformation
Application hosted on Vercel

I would really appreciate any help regarding this , thank you!