PDF Base64 decoder

[Bfanti]

Hello,

I got a PDF Base64 encoded, and I am looking for a way to decode it to download the PDF file.

Is there a way to do so in Bubble ?

Thanks,

[Bfanti]

I have found the solution.

For information, you just have to create a link with extrernal destination page :
“data:application/pdf;base64,BASE64_PDF_FILE”

And that’s it !

[ryanck]

Hello @Bfanti,

How did you do this? I´m using selectPDF. Is this Base64 something like jspdf?

Thanks a lot.

Bests.

[Bfanti]

Hello,

Bas64 is a type of encoding to transfer media datas like pdf, image, etc. It is to encode datas into characters to be more suitable to ship across the network. It avoids bad interpretation of your raw datas.

In my case, I am using a API to get PDF, and it sent it to me in base64. That’s why I was looking for a way to show it as a PDF, and not as a string.

Hope it can help,

Baptiste

[ryanck]

Hello Baptiste,

Thanks for the explanation. Too complicated for me but I understand this is a workaround that fits your needs so that´s wonderful.

Thanks.

Bests.

[trevor]

@Bfanti

data:application/pdf;base64,BASE64_PDF_FILE

Is this still working for you?

I’ve got an api return with the encoded base64 string. Im having trouble getting it to display the pdf.

TIA.

[Bfanti]

Yes, it works from my side !

[fanofmotivation]

have you tried this one ? https://codebeautify.org/base64-decode

[jarrad]

in most cases what your issue would be is that the base64 is “web safe” try adding to the end of your baser64 find and replace: - for + then another find and replace: _ for /

do the opposite for sending… and yes regex will work if you want to compile the two find and replace operators.

[kalikan]

You can do this using the ‘Toolbox plugin’ (Toolbox Plugin | Bubble) and ‘run a Javascript Action’ with these lines of code :

let a = document.createElement("a");

a.href = "data:application/octet-stream;base64," + data64;
a.download = "fileName.pdf"
a.click();

Source : https://stackoverflow.com/a/49165230

[kaventan1]

Hi, Thanks for the solution. I am very new to JS and toolbox. I noted the script above

let a = document.createElement("a");

a.href = "data:application/octet-stream;base64," + data64;
a.download = "fileName.pdf"
a.click();

I have stored the Base64 encoded text of the pdf attachment as a field in an email thing. I do not know how to pass my Base64 Text to this Javascript snippet in Toolbox action. Can anyone help.

[kaventan1]

I have also replaced data64 with my thing. However it still does not work.

[kaventan1]

I have finally done it. The sample solution below:

[fab118]

Hi, thanks for this solution.

Is it also possible instead of downloading the pdf, to save it directly to the database?

[lstk.kb]

I tried another way to display this pdf file as a string.
src=“data:application/pdf;base64, BASE64_PDF_FILE ”

Is it possible to convey this in an email?

[gmlorencette]

Hello! Can you help me with more details on how to do this? “data:application/pdf;base64,BASE64_PDF_FILE” must be added to the PDF file URL?