Hello !!
I am trying to upload images with .zip from retool to external source.
I am using JSZip and filesaver.js libraries. But could not managed to upload or download files.
My system needs to
get images from fileInput
zip those filesand
post it to external source with POST.
I did the first part. I can et multiple images as responses. but 2 and 3. part is still on search 
my current js code is uploaded.
I hope I described myself 
thank your for your time !
Hi @alicem! I haven't used these particular libraries myself but can still look into this with you What issues are you running into in particular with your current setup?
Hello,
My first need is to zip the image files user uploaded from retool.
And send it to external model with rest api.
Rest api need its content-type as application/zip.
I am stuck at both parts. Cant get images in zip ( I also tried uploading zip directly to the retool and make retool send the data to external source. But it failed in api part. )
Tried jszip and it runs in my other test enviroment perfectly. But in retool I just get the "query succesfull" message but nothing happens.
It looks like JSZip allows you to generate a base64 binary for the file which will likely be passed around a bit easier. The following code lets me download a zip containing an uploaded image:
let zip = new JSZip();
zip.file("Hello.txt", "Hello World\n");
let img = zip.folder("images");
img.file("smile.png", fileDropzone1.value[0], { base64: true });
let file = await zip.generateAsync({ type: "base64" });
utils.downloadFile({ base64Binary: file }, "test", "zip");
One important thing to point out here is that you may need to reference fileDropzone1.value[0] instead of fileDropzone1.value. Does the API need the file need to be uploaded specifically as a Blob?
Hey, thank you for your fast response. I will try the method you mentioned. And set as solution if it works.
For the other part of your question. I attached The api doc of my need.
And this is the sample curl document for my need
From that, it looks to me like binary should work but I could be misreading things, let me know if you run into any trouble!
Thank you!! And I want to ask you one more simple question
When I try to post the zip file with rest, how can I do it with generating .zip file and send it through api without downloading.
Thank you so much for your time and patience
No problem! You can try using a binary body and the atob() function:
If you write your query like that you can trigger it in the JS query you use to grab the data itself as follows:
let zip = new JSZip();
zip.file("Hello.txt", "Hello World\n");
let img = zip.folder("images");
img.file("smile.png", fileDropzone1.value[0], { base64: true });
let file = await zip.generateAsync({ type: "base64" });
uploadQuery.trigger({ additionalScope: { base64Data: file } });
Your code for zip is worked!!!! Thank you so much for your time and effort.
I will try your last reply with binary body and atob() func.
I will update the solution if works.
thank you so much again
I can trigger the upload data but cant manage to get the data to database. It just creates dataset and leave empty inside.
but upload query gave the success message.
Would you mind posting the code for the JS query you're using as well as a screenshot of the upload query just so I can double-check it? Then I'll look to see if I can find what else might be causing the issue 
The Js code
let zip = new JSZip();
//zip.file("Hello.txt", "Hello World\n");
let img = zip.folder("images");
img.file("smile.png", fileDropzone1.value[0], { base64: true });
let file = await zip.generateAsync({ type: "base64" });
UploadDataset.trigger({ additionalScope: { base64Data: file } });
the upload api :
Btw I can succesfully download the zipped file
when query triggered it is triggering the upload trigger but cant get zip file to api source.
I think issue is the api's requested body type.
Btw I can do it from python with same .zip file
Are you getting the Cannot restructure property 'data' of 'base64Data' as it is null. when you trigger the upload query using {additionalScope: { base64Data: file }} or is it a different error? If it's a different error message would you mind sharing that?
I'm also curious to see what that query looks like in your network tab.
When its triggered as you said its not giving any errors and api responses "successfull " message, but when I check the database I am trying to post the zip it shows blank database.
Also I tried to trigger the api with same zip file bur in python enviroment, it sets the database perfectly.
body of the succesfull request is here. but it gives blank data at api side 
Hmm... unsure what the solution is here but I'll look into it some more and get back to you!
still the same error
