How to submit a picture/photo to external service via REST on mobile

App Building
,
1

Hi there,
I am facing a problem to upload/transfer a picture to a REST API. I am using the mobile ImageInput component to capture a photo. When I call the rest api it seems not to transmit the photo in the proper way. I tried to set the flag to upload the photo to retool storage and make it public. But when I try to open the transfered link in my browser I can't get the photo.

Here are some screenshots:

image
image1976×2064 396 KB

image
image648×1552 36.3 KB

I also tried different services but it did not work. Also uploading to wordpress or so did not work. It seems that I am missing something.

Any help is highly appreciated,
Jens

2

Ok for everyone who has problems sending captured photos via REST multiform, I have found the solution:
You basically need to get the base64Data form the imageinput using utils.getDataByObjectURL and create a file object. This file object needs to be used in the REST API call:

image
image1386×984 44.1 KB

var input = imageInput.files[0];
var b64Image = await utils.getDataByObjectURL(input.uri);
var file = {
name: "app_upload_" + Date.now() + "." + input.type.split("/")[1],
sizeBytes: input.size,
type: input.type,
base64Data: b64Image.replaceAll("data:image/jpeg;base64,", "") //This needs to be removed to match the formdata format
};

uploadBusinessCard.trigger({
additionalScope:{
fileData : file
}
});

1 Like
3

I'm happy to see you were able to figure it out!
Here is a topic that goes over this implementation in detail in case other users need to reference: Can't upload images to RETOOL STORAGE - #4 by retool_team