Best way to display a PDF from base64-string

[Andreas]

Hello,

I recieve a PDF from a WebService as a base64 string. Now I don't know which way is the best to display the pdf on mobile devices or which ways are possible. So is it possible to give the base64 string directly to some kind of pdf viewer instance like shown in the examples "InApp Browser/Childbrowser" or do I really need to convert the base64 to a binary array, write it into the local file storeage and open the file?

regards and a happy x-mas!

[iliev]

Hello Andreas,

For iOS you can open base64-ed pdf by navigating to the following data uri:
data:application/pdf;base64,YOURBASE64DATAHERE

I'm afraid that you can't do this in Android so you can follow this stackoverflow thread to get more ideas and decide what is the best solution for you.

The universal way around is as you said - write it to the local file storage and open the file.

Best wishes and happy holidays,
iliev
Telerik
You've missed the Icenium Visual Studio Integration keynote? It has been recorded and posted here.
Looking for tips & tricks directly from the Icenium team? Check out our blog!
Share feedback and vote for features on our Feedback Portal.

[Andreas]

Hey,

we created a "simple to use" solution. The Base64-String is converted to a ArrayBuffer, subsequently the buffer is written into a file on the local filesystem. Then the file is opened by the operating system.

If somebody is interessted in doing stuff like that, you can have look on by blog and/or just download the Javascript file or Icenium project.

http://blog.slxdev.net/?p=14

[Nirav]

Hello,

I am trying to display image,docs from base64-string for Android and IOS. I am using inapp browser plugin to display image and doc files in app.

For IOS i am able to display images using below code.But facing issue with Android and Blackberry.
window.open(urlData, "_blank", "location=no,enableviewportscale=yes");

I am passing urlData parameter as base-64 string. Android and Blackberry nothing is displaying. After searching i found this post.

Alternative: just store that whole data string in your database. Then when you render your <img>tag you can simply dump it into the src attribute:<img src="<< base-64 encoded data string>>" /> 

After inserting above code i am able to display image but how to close the image ? How to open image in popup ? So user can close the image.

Thanks,
Nirav

[Tsvetina]

Hi Nirav,

If I understand correctly, you got the functionality related to visualizing the base64 string as an image and you only need to make it possible to open and close this image. There are various JS plugins for opening an image or other element in a popup. One option is the jQuery Popup:
jQuery Popup

Take a look at the third example (Photo Lightbox) for a similar scenario.

Regards,
Tsvetina
Telerik

 

 

[Nirav]

Hi Tsvetina,

Thanks for the reply. Yes i want to open image in pop up, but i am getting image URL. But i don't want to open image and user has to click the image.

I am trying window.open(url, _blank). But instead of window.open i want once user clicks on attachment link preview needs to display on same page. same like email attachment preview.

Thanks,
Nirav

[Tsvetina]

Hello Nirav,

Did you check out the lightbox sample on the page that I linked to? It does what you describe. You define a popup with your image, which isn't initially visible. When triggered, the popup displays on the same page.

Regards,
Tsvetina
Telerik