Creating a blob

Here is the code I am using ATM

const byteCharacters = atob( {{ getDrawingTranslation.data.base64Binary }} );
var byteNumbers = [];

for (let i = 0; i < byteCharacters.length; i++) {
byteNumbers[i] = byteCharacters.charCodeAt(i);
}

const byteArray = new Uint8Array(byteNumbers);
const blob = new Blob([byteArray]);

return blob

I am using this in a transformer. All that gets returned and accessed from the transformers value is an empty object. I have tried this from a js query and the same thing is happening. I cannot find a reason for this to not work. Does Blob() work within retool?

Hey @shawncrocker,

This might help -> FileInput component use base64 encoding/how to decode? - #2 by minijohn

Using atob should work :v:

atob() is working. Its the part where a blob is created from the unit8 array that has got me stuck. The blob is empty. Do you know what might be happening specifically with the blob part of this problem?

Hey @shawncrocker!

All JavaScript runs in a sandboxed iframe and so at the moment we're limited by what can be passed using the postMessage API, this means that complex types like Blobs don't get passed from JavaScript through the Retool model.

Is there something in particular that you're looking to do with the Blob? Will try and look into potential workarounds with you!

Hi @Kabirdas I was actually hoping to convert base64 strings so that I can upload them to a google drive. I have actually discovered that I can include a parameter in the post to google drive triggering the drive to receive the base64 and convert to a file during the transfer. Which is actual more preferred anyway. I left this question up because I was still curious what I may be doing wrong to create a blob. Good to know though that blob and retool are not the ideal situation. Thanks!

1 Like

One trick I've found that can work around this limitation of Retool's sandboxed architecture in some cases, is to use additionalScope. You can't return a blob from a JS query to be referenced elsewhere with <JSQueryName>.data. BUT you can use the <query>.trigger method to call another query and pass a blob to that query with the additionalScope parameter. Here's a link to Retool's docs on the <query>.trigger method and the additionalScope parameter.

@everett_smith Thanks. I will give that a try.