onverting base64 data and showing this as a file in our webpage is tricky sometime. I wrote this article, because
I was facing problem in showing
base64 data into PDF in one of the my project.
The scenario was, I was getting the base64 data in API response, and I need to show a new popup window and in this
popup the pdf supposed to shown. That pdf supposed to be generated
by that API response.
So to acheive this goal, I explored a lot and found the best way is, I convert that base64 into Blob data and later shown this blob data into iFrame.
Let's have a look on below function to convert base64 data into Blob data
In the below codes, I am doing following stuff:
* Opening a new popup window with width 100 and height 100.
* Getting a reference of that new window and calling open().
* Resizing that window to screen width and height.
* specifying the content type ('application/pdf').
* Converting base64 data to blob data with given contentType.
* Writing this blob data into iFrame and then adding it into document.
* Printing that contentWindow with getElementById.
Let's see in the codes:
Let's call the print function to convert that base64 into pdf.
In this article, we converted base64 data into pdf and shown this pdf in a new popup window. We converted base64 into blob data and displayed this blob in new popup window using iFrame.