Generate PDF and save to file object or as base64 string

Ask the community
,
1

Hi , I’m using the html2pdf example to generate a pdf from the app. But how can save it to a temp file object or as a base64 string?

Hope someone has solved this before :smiley:

2

Hi!

I just asked Gemini 2.5 pro. It suggests the following (given this example in our docs):

// Change 'highScorers' to match the Element ID used in step 1.
const element = document.getElementById('highScorers');
/*
  Change the margin, in millimeters, as desired.
  Filename is optional if you're not saving directly.
  Change the width, in pixels, to match the width used in step 1.
*/
const opt = {
    margin:       10, // mm
    filename:     'High Scorers Report.pdf', // Will be used by jsPDF but not for saving here
    html2canvas:  { width: 900, useCORS: true } // width in pixels
};

html2pdf().set(opt).from(element).outputPdf('datauristring').then(function(pdfDataUri) {
    console.log('PDF as Data URI:');
    console.log(pdfDataUri);

    // If you need only the base64 part (without the "data:application/pdf;base64," prefix):
    const base64String = pdfDataUri.substring(pdfDataUri.indexOf(',') + 1);
    console.log('Pure Base64 String:');
    console.log(base64String);

    // Now you can use the pdfDataUri or base64String as needed,
    // for example, send it to a server, store it, etc.
}).catch(function(error) {
    console.error('Error generating PDF as Data URI:', error);
});

resolve();

Could you try it?

3

That worked a lot better then chatGPT :raising_hands:

I got the base64 string in the console as I wanted - Thanks!
Hope this came from the preview of AI in appfarm!

4

Well, it’s the model we are currently using - outperforming OpenAI in many areas (at least technical domains)

1 Like