Repository navigation
Comma escaping for text overlays is not working correctly #702
Description
Describe the bug in a sentence or two.
Adding text overlays with commas (,) on videos results in %2C escape sequences in the overlay.
Other characters like quotes, dashes, question marks, and percent are automatically handled correctly and appear correctly in the overlay.
Manually escaping the comma does not work either because the % is automatically escaped.
Issue Type (Can be multiple)
[ ] Build - Can’t install or import the SDK
[ ] Babel - Babel errors or cross browser issues
[ ] Performance - Performance issues
[x] Behaviour - Functions aren’t working as expected (Such as generate URL)
[ ] Documentation - Inconsistency between the docs and behaviour
[ ] Incorrect Types - For typescript users who are having problems with our d.ts files
[ ] Other (Specify)
Steps to reproduce
Create a text overlay on a video that contains a comma.
Sample code:
let transformations = [
{ width: 900, height: 900, crop: "fill" },
{ color: "#ffffff",
overlay: {
font_family: font,
font_size: 48,
text: "So, \"here\" & here are 10% special chars - right?",
text_align: "center"
},
width: 800, crop: "fit" },
{ duration: 2.0 },
{ flags: "layer_apply", gravity: gravity, x: 0, y: 0.05, start_offset: 0.0, end_offset: 2.0 }
];
let namedVideoTransformation = "myTransformation";
await cloudinary.v2.api.create_transformation(namedVideoTransformation, {
transformation: transformations,
});
videoUri = cloudinary.url("folder/video.mp4", {
resource_type: "video",
transformation: [namedVideoTransformation],
});Error screenshots
Versions and Libraries (fill in the version numbers)
Cloudinary_NPM SDK version 2.5.1
Node - 23.7.0
NPM - 10.9.2
Activity
tommyg-cld commentedon Feb 20, 2025
@greimers when using special characters like commas, they need to be URL encoded and double-escaped as per Special characters. Our SDKs handle this automatically meaning it will convert the comma to
%252Cbut when creating a named transformation, it doesn't seem necessary to double-escape which our SDKs don't seem to take into account so we'll look into resolving this further.For now as a workaroud, you can create a named transformation using a string and URL encoding the comma yourself e.g.
momoip commentedon Mar 3, 2025
Hi @greimers,
The issue is a known one in v1 SDKs. (NodeJS v2 is a v1 SDK).
A better workaround would be to create a transformation string from that object using generate_transformation_string function and URL decode it once. and pass the resulting string to create_transformation function.