OL Learn

Base64 to PDF in Designer


We are not using the workflow.

We get adhoc xml files which contain a base64 encoded string which is in fact a potentially multipage PDF.
We are looking for ways to convert the base64 encoded string and use it as the background image of our single section.

I have tried the atob function in a control script but it’s not recognised as a valid function. Not sure if Connect uses an older version of javascript.

I tried using this directly in source code but it has also not worked as expected

<img src="data:application/pdf;base64,JVBERi0xLjcKJeLjz9MKMTUgMCBvYmoKP…etc>

Can anyone help with how to convert a base64 to pdf and use it as background image in a template, without using the workflow?

Can’t use the <img> element for that. Use <object> instead:
<object class="internal" data="data:application/pdf;base64,...*Base64String*..." width="800px" type="application/pdf" height="1000px" />

Phil, thank you for responding.
For the life of me, I can’t get Connect to show the PDF. My section has a paragraph element by default with a class of ‘.background’. I have added the following code targetting the .background class:

var base64string = record.fields.base64string;
var background = ‘<object class=“internal” data="data:application/pdf;base64,’ + base64string + ‘width=“800px” type=“application/pdf” height=“1000px” />’;

Where do I inject it in the template?

This works for me:

var base64string =  record.fields.base64string;
var background = 	'<object width="800px" type="application/pdf" height="1000px" data="data:application/pdf;base64,' +
					base64string +
					'" />'


My script targets an element whose class is “background”: