urlencode for /cdn-cgi/image/.....$image_path

[DenisZando]

Hello there,
First, happy new year to all of you!

I'm reaching you about a little improvement in the cloudflare-image-resizing.php on lines 215/220 and subsequent calls :

• 269/274,
• 322/328,
• 385/391,
• 441/447,
• and finally 526/531.

I reach errors due to encoding errors while being in UTF-8.
I made a fix on my website but I think it could be an improvement for all user if you can make it your way !

// Original code line 215
$image[0] = CF_IMAGE_RESIZING_SITE_URL.'/cdn-cgi/image/width='.$sizes[0].',height='.$sizes[1].',fit='.CF_IMAGE_RESIZING_FIT.',quality='.CF_IMAGE_RESIZING_QUALITY.',format='.CF_IMAGE_RESIZING_FORMAT.',onerror='.CF_IMAGE_RESIZING_ONERROR.',metadata='.CF_IMAGE_RESIZING_METADATA.CF_IMAGE_RESIZING_SITE_FOLDER.$image_path;

// New code DZ
// New variables defined before the condition tests
// I made it in 2 parts to manage if/else actions
$mashup_size = "width=".$sizes[0].",height=".$sizes[1].",fit=".CF_IMAGE_RESIZING_FIT ;
$mashup_size_encoded = urlencode($mashup_size) ;
$mashup_extradata = "quality=".CF_IMAGE_RESIZING_QUALITY.",format=".CF_IMAGE_RESIZING_FORMAT.",onerror=".CF_IMAGE_RESIZING_ONERROR.",metadata=".CF_IMAGE_RESIZING_METADATA.CF_IMAGE_RESIZING_SITE_FOLDER;
$mashup_extradata_encoded = urlencode($mashup_extradata) ;	

// Then the replacement code of line 215, calling encoded in if
$image[0] = CF_IMAGE_RESIZING_SITE_URL.'/cdn-cgi/image/'.$mashup_size_encoded.','.$mashup_extradata_encoded.$image_path;
// And line 220 in else
$image[0] = CF_IMAGE_RESIZING_SITE_URL.'/cdn-cgi/image/'.$mashup_extradata_encoded.$image_path;

I replicate these changes on the 6 pairs of calls (lines mentioned before) but I guess you can make it in a better way at a higher level in the process.

Hope to hear from you, if you have any questions too.
Best regards,
Denis

[Norbert Boros]

Calling urlencode/decode for each image on each request is not ideal and unnecessary. If your images have "bad names" it's time to name/rename your images accordingly.

For perfect caching and by standard you should name your images using a-Z-0-9, preferably each image should have a hash as name.

So not approved.

[DenisZando]

Hello Mecanik,

Thank you for your answer !

All my images are named the right way you say. Here are some examples :

• location-materiel-audio-visuel.jpg
• enregistrements-des-debats-multilingues.jpg
• accueil-des-participants-bienvenue.jpg
• creation-de-badges-acces-gestion-vip.jpg
• creation-de-badges-acces.jpg
• collaboration-interactive-reunion-multilingue.jpg

The problem doesn't came from the image path itself stored in the $image_path variable.
Because I had no errors (W3C validator) before using your amazing resizing tool.
Like you can see in the code on the previous message, I only encode the other parts of the path.

Maybe there is a compatibility problem with my configuration ?
Here are some informations about my environment :

• the website is running WordPress 6.1.1
• PHP 8.0.27 (mysqlnd) and 10.3.37 MariaDB in utf8mb4 (allow any Unicode character) on Apache Linux 5.15.0 server
• using Cloudflare 4.11.0 and CloudFlare Image Resizing 1.3.

Well, waiting to hear from you soon!
Have a nice day!