How do Decode base64 image received to display it in a case?
Hello there,
I got base64 image code through a connector REST/JSON and need to display it with other case informations.
There is no property in the case because there is no interest in save it there since it is already saved elsewhere.
Checked some topics but usually related to work items, hence I got confused about the referentes (sorry about that).
Any thanks in advance for any help
Accepted Solution
Pegasystems Inc.
AU
Fundamentally all you should need are the class keys to save (the content is admittedly nice but not a key).
So to take your example above, creating an Object of RFB, then setting:
- pyApplicationName: webwb
- pyFileName: ImgTest
- pyFileType: jpg
- pyFileSource: (Base64 encoded content)
Should do the trick.
To take a deeper look at what else is set (Though not necesarily required), simply open an instance, and view xml.
Pegasystems Inc.
GB
Can you outline a little more about what you are doing here ?
You'll need to save the base64 somewhere (in memory I mean, not the DB); in order to 'play-it-back' to the client ?
(I think you are using PRPC as a 'man-in-the-middle' here right ? You are connecting to PRPC; which is making a REST call to another system; and now you want PRPC to forward that information back to the original browser or something like that ?)
EDIT: is the endpoint where the Image Data is stored also available to the end-browser or not ? (It might be simpler to 'mash-up' the data client-side if so).
Paraná Banco SA
BR
Thanks you mate for your reply, let me try to give more information.
I'm using Personal Edition PEGA 7.2.1.
Let me try to expose the scenario here:
- There are some data coming through REST connection and JSON (DONE)
- The data will be showed in a browser using Worker Portal (DONE)
- The data will be partially saved into the work case, but all of them will be showed to the user (DONE except for the images)
- Among those data, there are images as well, sent as base64 and has to be showed along with the rest of the data to the user. (NEED HELP)
---> that is the point where I need some help here. In order to make it possible I need to decode the incoming base64 image code (fed by connector into a Data Page) and show into the user portal (section/attachment/ico_image component within the current work class).
Thanks you mate for your reply, let me try to give more information.
I'm using Personal Edition PEGA 7.2.1.
Let me try to expose the scenario here:
- There are some data coming through REST connection and JSON (DONE)
- The data will be showed in a browser using Worker Portal (DONE)
- The data will be partially saved into the work case, but all of them will be showed to the user (DONE except for the images)
- Among those data, there are images as well, sent as base64 and has to be showed along with the rest of the data to the user. (NEED HELP)
---> that is the point where I need some help here. In order to make it possible I need to decode the incoming base64 image code (fed by connector into a Data Page) and show into the user portal (section/attachment/ico_image component within the current work class).
- You'll need to save the base64 somewhere (in memory I mean, not the DB); in order to 'play-it-back' to the client ? --- It is already saved in a Data Page linked to the connector which get the image
- (I think you are using PRPC as a 'man-in-the-middle' here right ? You are connecting to PRPC; which is making a REST call to another system; and now you want PRPC to forward that information back to the original browser or something like that ?) --- Actually PEGA is more like an back-end whereas those data will be manipulated and generate other ones. The data will be showed to the user through the user portal. Only an status will be sent back to the mobile plataform
- EDIT: is the endpoint where the Image Data is stored also available to the end-browser or not ? (It might be simpler to 'mash-up' the data client-side if so). --- didn't get what you mean, sorry
Incessant Technologies
GB
You can write a section/Html/Control rule and include the image tag with the base 64 string like below.
<img src=”data:image/png;base64,Your base 64 string=”>
For example.
<img src=”data:image/png;base64,iVBORw0KGgoAAAAN8bgAAAAASUVORK5CYII=”>
As your base 64 string is dynamically changing replace it with your property.
Paraná Banco SA
BR
Hey mate, thank you for your reply.
There are 2 points that I'm not sure:
- this method suports long strings characteres? Because they will be, and I read somewhere that this method has character limit(short limit)
- I'm not used to work with HTML straight into PEGA, so not sure how to do it. (Tried to create a section > HTML > unmarked Auto-generated HTML > inserted the img code and didn't work - probably because I don't how to reference a data page property inside the HTML source code)
Pegasystems Inc.
AU
On your Data Page mapping prepend the tag 'data:image/jpeg;base64, ' (substituting image/jpeg with whatever format is pertinant) to the base64, then simply source an OOTB image control on that property
Paraná Banco SA
BR
Hi mate, thanks for your answer.
Indeed it worked that way.
Now I still would like to know how to work the other way mentioned previously. Using activity, but I don't know how to put the decoded base64 string into a Rule-File-Binary objected created (for instance webwb*ImgTest*jpg), never referred to this kind of object before.
Accepted Solution
Pegasystems Inc.
AU
Fundamentally all you should need are the class keys to save (the content is admittedly nice but not a key).
So to take your example above, creating an Object of RFB, then setting:
- pyApplicationName: webwb
- pyFileName: ImgTest
- pyFileType: jpg
- pyFileSource: (Base64 encoded content)
Should do the trick.
To take a deeper look at what else is set (Though not necesarily required), simply open an instance, and view xml.