Upload multiple files to Google Cloud Store or Amazon S3

Learn how to upload files with Google Cloud Store or Amazon S3.

With the File Input component, you can set the Selection type to Multiple files to upload more than one file.

You can then create queries to upload all the selected files to GCS or AWS S3 through a connected resource. This requires:

1. A JavaScript query that loops through the files in the file picker and then triggers an upload query.
2. An upload query for the resource. This upload runs for each of the files in the loop.

Create a JavaScript query

This JavaScript query loops through the files in the file picker using a for() loop. For each file, the upload query (uploadToS3 in this example) is triggered.

async function go() {
  for (let i = 0; i < fileInput1.value.length; i++) {
    await uploadToS3.trigger({
      additionalScope: {
        i: i,
      },
    });
  }
}

return go();

To make Retool wait to execute the entire async function loop (e.g., resolve the Promise), you need to return the function call. If you only call the function, onSuccess triggers may act unpredictably.

Create an upload query

In this example, uploadToS3 is a query to the S3 Resource.

The data posted to S3 is listed below:

Data	Value
S3 Action	Upload data
Bucket name	your-bucket-name
Export File Type	Binary
Upload File Name	{{ fileInput.value[i].name }}
Upload Data	{{ fileInput.value[i].base64Data }}