Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Blazor pages generate HTML to PDF

Tags:

c#

blazor

I want to print a rendered modal that opens up with some vehicle information, The button is present on the modal and on click should convert the modal HTML to PDF.

Please advise if there is a C# function or so that I can use, which will extract the current HTML I want to convert to PDF, or steer me in the right direction. I have only been doing C# for about 2 months so lacking experience and expertise.

Edit: Also trying to get the code to use CSS when dumping the PDF.

I have added the following code.

References, etc. added.

@using BidWheels.Configuration;
@using BidWheels.Shared.Controls;
@using BidWheels.Data;
@using BidWheels.CustomProviders;
@using BidWheels.Services;
@using System.Timers;
@using Syncfusion.Pdf;
@using Syncfusion.HtmlConverter;
@using System.Linq;
@using System.Web;
@using Microsoft.AspNetCore.Http;

@inject AppState AppState;
@inject UsersDAL UsersDAL;
@inject MainDAL MainDAL;
@inject NotificationService NotificationService;
@inject GeneralConfiguration GeneralConfiguration;
@inject GlobalVar GlobalVar;
@inject GlobalVarShared GlobalVarShared;
@inject Microsoft.JSInterop.IJSRuntime JS
@inject IHttpContextAccessor httpContextAccessor

Button to proc the function to generate the PDF

        </div>
        <button class="btn btn-outline-success" @onclick="@CreatePDF">Generate PDF</button>
    </div>

This is the function invoked by the button.

@functions {

    void CreatePDF() 
    {

>         //Initialize HTML to PDF converter
>         //HtmlToPdfConverter htmlConverter = new HtmlToPdfConverter(HtmlRenderingEngine.WebKit);
>         //WebKitConverterSettings settings = new WebKitConverterSettings();
>         //Set WebKit path
>         //settings.WebKitPath = Server.MapPath("~/QtBinaries");
>         //Assign WebKit settings to HTML converter
>         //htmlConverter.ConverterSettings = settings;
>         //Get the current URL
>         //string url = HttpContext;
>         //Convert URL to PDF
>         //PdfDocument document = htmlConverter.Convert(url);
>         //Save the document
>         //document.Save("Sample.pdf", HttpContext.Current.Response, HttpReadType.Save);

Code updated to below
        HtmlToPdfConverter htmlConverter = new HtmlToPdfConverter();
        WebKitConverterSettings webKitSettings = new WebKitConverterSettings();
        webKitSettings.WebKitPath = Directory.GetCurrentDirectory() + "\\wwwroot" + @"\QtBinariesWindows\";
        webKitSettings.MediaType = MediaType.Print;
        webKitSettings.Orientation = PdfPageOrientation.Portrait;
        htmlConverter.ConverterSettings = webKitSettings;
        Convert HTML to PDF.
        string baseUrl = @"" + Directory.GetCurrentDirectory() + "/wwwroot/css/";
        string HTMLBody = await JS.InvokeAsync<string>("getHTMLtoRender", PDFBody);
        PdfDocument pdfDocument = htmlConverter.Convert(HTMLBody, baseUrl);
        MemoryStream memoryStream = new MemoryStream();
        Save and close the document instance.
        pdfDocument.Save(memoryStream);
        JS.SaveAs("Sample.pdf", memoryStream.ToArray());

    }

}

The following errors are being generated.

Error messages generated by the code for the above:

Error messages generated by the code for the above

New errors generated and lib:

New errors generated and lib

like image 606
RastaFarier Avatar asked Nov 26 '22 23:11

RastaFarier


1 Answers

1st render razor component to html string as the following

var host = new TestHost();
var component = host.AddComponent<YourComponent>();
var html = component.GetMarkup();

then pass this string to IronPdf library to generate the pdf for you

using IronPdf;
var Renderer = new IronPdf.ChromePdfRenderer();
var PDF = Renderer.RenderHtmlAsPdf(html);

References

  1. stackoverflow link How to render a Blazor component into an HTML string
  2. IronPdf IronPdf website
like image 82
Ahmed Aboelmagd Avatar answered Nov 28 '22 12:11

Ahmed Aboelmagd