Question
IKOR
AU
Last activity: 13 Mar 2024 19:58 EDT
Need assistance with displaying AWS S3 image(base64 encoded) in section rule -
Hi there,
We have come across a requirement in our application that requires the Pega platform to retrieve an image from an AWS S3 bucket and display it under the data class."
Approach:
- Created a new repository (Data-Repository) instance with AWS S3 storage.
- Leveraged the OOTB data page (D_pxGetFile) to retrieve the image using the repository and file path.
- Received the content in base64 encoded format.
- Created a section rule in the data class with the following code:
<html> <body> <img id="decodebase64Image" src="" alt="Decoded Image"> <script> var base64String = "<%= tools.getHTMLValue('PropertyName') %>"; document.getElementById('decodebase64Image').src = "data:image/jpeg;base64," + base64String; </script> </body> </html>
- Rendered the section rule on the parent section.
Unfortunately, the approach did not work. Appreciate it if any insights can be shared.
Cheers,
Narendra Potnuru
Accepted Solution
Updated: 13 Mar 2024 19:57 EDT
Maantic
IN
@NPOTNURU - You can try the below
<html> <body> <img id="decodebase64Image" src="<pega:reference name='<<propertyName>>' />" alt="Decoded Image"> </body> </html>
The propertyName should contain the whole string "data:image/png;base64," + the base64 value.
IKOR
AU
@KALINGAROUT Thanks for the solution. The recommended approach worked.