Menu
So here my problem: I have a pdf file as a base64 String that i am getting from the server. I would like to use this string to either display the PDF directly to the browser or give it a option of "Save as..." when clicking on a link. Here the code i am using:
<!doctype> <html> <head> <title>jsPDF</title> <script type="text/javascript" src="../libs/base64.js"></script> <script type="text/javascript" src="../libs/sprintf.js"></script> <script type="text/javascript" src="../jspdf.js"></script> <script type="text/javascript"> function demo1() { jsPDF.init(); jsPDF.addPage(); jsPDF.text(20, 20, 'Hello world!'); jsPDF.text(20, 30, 'This is client-side Javascript, pumping out a PDF.'); // Making Data URI var out = jsPDF.output(); var url = 'data:application/pdf;base64,' + Base64.encode(out); document.location.href = url; } </script> </head> <body> <a href="javascript:demo1()">Run Code</a> </body> </html> Its working fine with Chrome and Safari. Firefox does recognize the pdf but does not display it as FF requires extensions to be present but the data-URI has none in this case. The reason I'm insisting here, if chrome and safari get it to work, then there has to be a solution for FF and IE
I know there are a few relevant questions to this but not really the exact one and now also a bit old ones. I know a workaround would be to have the pdf generated at server side but I would like to generate it at client side.
So please intelligent folks, is it possible through some hacks or additional JS download plugins?
777
How to convert Base64 to file. Paste your string in the “Base64” field. Press the “Decode Base64 to File” button. Click on the filename link to download the file.
In JavaScript there are two functions respectively for decoding and encoding Base64 strings: btoa() : creates a Base64-encoded ASCII string from a "string" of binary data ("btoa" should be read as "binary to ASCII"). atob() : decodes a Base64-encoded string("atob" should be read as "ASCII to binary").
You can create an anchor like the one showed below to download the base64 pdf:
<a download=pdfTitle href=pdfData title='Download pdf document' /> where pdfData is your base64 encoded pdf like "data:application/pdf;base64,JVBERi0xLjQKJcOkw7zDtsOfCjIgMCBvYmoKPDwvTGVuZ3RoIDMgMCBSL0ZpbHRlci9GbGF0ZURlY29kZT4+CnN0cmVhbQp4nO1cyY4ktxG911fUWUC3kjsTaBTQ1Ytg32QN4IPgk23JMDQ2LB/0+2YsZAQzmZk1PSPIEB..."
179
you can use this function to download file from base64.
function downloadPDF(pdf) { const linkSource = `data:application/pdf;base64,${pdf}`; const downloadLink = document.createElement("a"); const fileName = "abc.pdf"; downloadLink.href = linkSource; downloadLink.download = fileName; downloadLink.click();} This code will made an anchor tag with href and download file. if you want to use button then you can call click method on your button click.
i hope this will help of you thanks
26
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
