Upload image error: the parameter content is not a valid file

mlovell

Hi,

I'm using Xano and Bubble and trying to upload an image to a user's profile.

I've followed this tutorial: https://www.youtube.com/watch?v=eYn6XbhIpuI and the endpoint works in Run & Debug mode, and successfully initialized in Bubble.

However, when I upload an image on the front end I get the following error:

Any suggestions how I resolve this?

Endpoint and Bubble workflow below

nocodetalks

Instead of File uploader, use the "image uploader" in the bubble.

Follow me on Twitter.

mlovell

Thanks @nocodetalks that works as an alternative, but not necessarily the method I want to use as the image uploader displays the image within that element.

I'm interested why its not working as prescribed in the tutorial? As a test, if I hard code the base URL + path into the Dynamic link then it works.

So how can I format the URL correctly so Bubble passes it in the right format?

nocodetalks

@mlovell

Ahh, I think I got now why this is not working.

Check the url return from "fileuploader'file'url" . Url don't have "https:" in it.

mlovell

Not sure I'm understanding. I'm still failing to get it to work.

nocodetalks

@mlovell

Print the URL that fileuploader returns in the bubble and you will see "https" is missing from the URL.

mlovell

Unfortunately, that doesn't seem to be the case. The Bubble server log indicates the https is included in [FileUploader Upload image's value].

Jeremie Queyroux

I same issue on my side,

Any clues ?

endrefyl

Same here. Any solutions or explanations?

Lefteris - blupry.com

Hello @endrefyl,

Can you share a screenshot of the related with the image Upload API logs on the API Requests tab on your Dashboard Screen on Xano?

endrefyl

Hi, @Lefteris - Buynocodeapps! The response on this api is as follows (with a file URL as input):

And the response:

Ray Deck

Hey @endrefyl the "create image from file" requires a file resource as input. If what you have is the data as of var_2, you first need to "make file resource" from it (that's also in the upload functions menu) and then feed that resoruce to your create image call.

endrefyl

@Ray Deck Hi and thanks for the reply! I Think I have done that in the flow:

1. Create new file resource
2. Create variable (where I try to decode the raw data ref this post:
   https://community.xano.com/discussion/4178704/upload-image-error-the-parameter-content-is-not-a-valid-file
   )
3. Create image

Ray Deck

You are feeding the result of your base64 decode into your create image call. Instead, you need to base64 decode your text (assuming it is a base64-encoded image, whihc is a fact not in evidence), make that into a file resource, and then feed the file resource directly into the create image. I think re-sequencing will help you here.

endrefyl

@Ray Deck thanks for the reply! I see the confusion, sorry about that. The "file" is just an URL from S3 (open). To be more specific:

1. Send inn URL for the image (png).
2. Create file resource
3. Create image.

The issue is very like the same as above, just that the decoding doesn't seem too have any directly effect. The result from the testing is as follows (image beneath). Could it be that the "Create image" doesn't get the third "name, value" object? Since it seems like it creats an array with objects from the "Create file resource"?

Best regards, Endre

endrefyl

For future reference, I was able to make this work with the following workflow (with the WF order pointed out by @Ray):

1. Extract data from the "Get file resource Data.."
2. Create File Resource with the .data from the first step.
3. Create image

It may be a little bit confusing (for me at least) with the concepts of files, data, resource and the origin of the file/data. If I have evaluated this correctly, the point is to either send the raw data in at first, or the URL as a reference → create my own xano file resoruce/URL FROM the raw data → add it as an image where I want it to be.

Best regards, Endre