Download Images from a table

App Building
, ,
1

I have a table with URLs and Images (We can assume that this table will have less than 10 rows):

image
image1079×278 43.5 KB

Now I'm trying to download the images from the table in a loop:

for (i = 0; i < ImageTable.data.length; i++) {
utils.downloadFile({base64Binary: ImageTable.data[i].Image }, "" + i, ImageTable.data[i].FILEEXTENSION);
}

However when I open the files, the content is {} instead of the image binaries.

What is the best way to download the files? Are there any examples for that?

2

not ImageTable.data[i].Image is not a base64 string. You must use query to fetch url to get the base64 string.

Here is some related topic for your reference.

You also can use jszip library to download them in a zip file.

1 Like
3

Thanks Ansown, with your pointer I was able to come up with blow following solution.
Note: Calling the Rest Query for each image is a slow and cumbersome; it would be great to have access to the raw image data in the table directly but that might be a browser limitation...

The REST Query is:

image
image988×492 40.1 KB

And the corresponding javascript is:

let zip = new JSZip();

var i = 0;
var msg = "";
for (i = 0; i < ImageTable.data.length; i++) {
  var fileName = ImageTable.data[i].ID + '.' + ImageTable.data[i].FILEEXTENSION;
  msg = "Writing Image # " + i + ": " + fileName + " (" + ImageTable.data[i].PATH + ")";
  console.log(msg);
  try {
    var img = await Promise.resolve(QueryImage.trigger({
      additionalScope: { i : i } // This is where we override the `i` variable
    }));
  } catch (e) {
    console.error(e);
    utils.showNotification({title: "Error", description: e, notificationType: "Error"})
  }
  //var img = await utils.getDataByObjectURL("blob:" + ImageTable.data[i].PATH);
  //console.log(img);
  //uils.downloadFile({base64Binary: img.base64Binary }, "" + i, ImageTable.data[i].FILEEXTENSION);
  var binaryImg;
  try {
    binaryImg = atob(img.base64Binary);
  } catch(e) {
    binaryImg = img.base64Binary;
    console.log("WARNING: Image # " + i + ": " + fileName + " (" + ImageTable.data[i].PATH + ") is NOT base64 encoded!!!")
  }
  
  zip.file(fileName, binaryImg, {binary: true});
  //if (i===10) {break}
}
console.log("Done writing " + i + " out of " + ImageTable.data.length + " Images");
            
zip.generateAsync({
    type:"base64",
    compression: "DEFLATE",
    compressionOptions: {
        level: 9
    }}).then(function (base64) {
   utils.downloadFile({base64Binary: base64}, 'myzip', "zip")
}, function (err) {
   utils.showNotification({title: "Error", description: err, notificationType: "Error"})
});
1 Like