Don't know how to solve this error

Hey guys i’m trying to build an image uploader on my web-app that then converts the image into an SVG and stores this in a custom state in Bubble (this all goes well I tested it so far → i’m getting in the SVG as text string)

Now I want to add this to Canva (I use the “add image to Canva” so that users can edit this SVG which are basically vector lines on my website)

However i’m getting the following error:

When I try to debug with ChatGPT it says the SVG is basically not read properly by Canva and is very “picky” how it wants to receive it as input

I’ve tried changing the the input to utf8 standard and base64 (this I couldn’t even select in Bubble because its a text and can apparently only use for images) without luck

Do you guys know a way to solve this? I feel i’m very close to get this working

This are the settings I have now in Bubble for the properties of adding image to Canva:

“index’s SVG_Code” = custom state holding the raw SVG data as text
”index’s Width” = 800 (type = number)
”index’s X” = 0 (type = number)

Any help is much appreciated!

Best,
K

Why are you formatting the raw SVG? I am not familiar with this plugin but based off the property field name, it looks like it is expecting a URL and not the raw SVG. If so, what you need to do is to save the SVG into the DB as an image and then pass the plugin the URL of that file after it is in your DB. Though seems to be an unnecessary step for what you want to do since you can save processing time and WU by keeping it all client-side

It’s best you get in touch with the plugin developer instead.