Konwertuj HTML na PDF w ASP.NET Core z C# -- Przewodnik IronPDF

Jak wygląda wygenerowany plik PDF?

Klasa ChromePdfRenderer obsługuje wszystkie złożone operacje renderowania, zapewniając prawidłowe wyświetlenie struktury HTML, stylów CSS, a nawet kodu JavaScript w końcowym pliku PDF. Wartością zwracaną jest obiekt PdfDocument, którego właściwość BinaryData można przesłać bezpośrednio do przeglądarki jako plik do pobrania.

Jak konwertować dynamiczne ciągi znaków HTML?

Podczas pracy z treściami dynamicznymi, takimi jak raporty oparte na bazach danych, należy używać RenderHtmlAsPdf do bezpośredniej konwersji ciągów HTML. Ta metoda akceptuje dowolny poprawny kod HTML i zwraca w pełni wyrenderowany plik PDF:

var renderer = new ChromePdfRenderer();
string htmlContent = BuildDynamicHtml(); // your method to generate HTML
var pdf = renderer.RenderHtmlAsPdf(htmlContent);
pdf.SaveAs("dynamic-report.pdf");

var renderer = new ChromePdfRenderer();
string htmlContent = BuildDynamicHtml(); // your method to generate HTML
var pdf = renderer.RenderHtmlAsPdf(htmlContent);
pdf.SaveAs("dynamic-report.pdf");

Dim renderer As New ChromePdfRenderer()
Dim htmlContent As String = BuildDynamicHtml() ' your method to generate HTML
Dim pdf = renderer.RenderHtmlAsPdf(htmlContent)
pdf.SaveAs("dynamic-report.pdf")

To podejście sprawdza się dobrze przy generowaniu dokumentów PDF z szablonów HTML wypełnionych danymi w czasie rzeczywistym, przesłanymi formularzami lub dowolną treścią generowaną dynamicznie. Silnik renderujący zachowuje wszystkie style CSS, w tym niestandardowe czcionki, kolory i formatowanie tabel. Gdy kod HTML odwołuje się do zewnętrznych arkuszy stylów lub obrazów przy użyciu ścieżek względnych, należy przekazać baseUrl jako drugi argument, aby renderer mógł poprawnie rozpoznać te zasoby.

Jak konwertować statyczne pliki HTML z dysku?

W przypadku szablonów HTML przechowywanych jako pliki fizyczne należy użyć RenderHtmlFileAsPdf, aby je przekonwertować bez konieczności wczytywania ich najpierw do pamięci. Jest to wydajne w przypadku dużych szablonów i pozwala uniknąć łączenia ciągów znaków:

var renderer = new ChromePdfRenderer();
var pdf = renderer.RenderHtmlFileAsPdf("wwwroot/templates/report-template.html");
pdf.SaveAs("report.pdf");

var renderer = new ChromePdfRenderer();
var pdf = renderer.RenderHtmlFileAsPdf("wwwroot/templates/report-template.html");
pdf.SaveAs("report.pdf");

Dim renderer As New ChromePdfRenderer()
Dim pdf = renderer.RenderHtmlFileAsPdf("wwwroot/templates/report-template.html")
pdf.SaveAs("report.pdf")

Ta metoda automatycznie rozpoznaje ścieżki względne dla arkuszy stylów CSS, obrazów i innych zasobów zewnętrznych, do których odwołuje się plik. Działa to dobrze, gdy zespół projektantów przechowuje oddzielne pliki szablonów HTML poza kodem źródłowym aplikacji napisanym w języku C#. Metoda obsługuje zapytania o media drukarskie CSS oraz niestandardowe czcionki, dzięki czemu szablony stworzone dla środowisk drukarskich są wiernie renderowane bez dodatkowej konfiguracji.

Jak przekonwertować adres URL strony internetowej na plik PDF?

Aby przechwycić aktywną stronę internetową lub wyrenderować stronę dostępną pod adresem URL jako plik PDF, użyj RenderUrlAsPdf. Ta metoda uruchamia silnik Chrome, przechodzi do adresu URL, czeka na pełne załadowanie strony, a następnie przechwytuje wyrenderowany wynik:

var renderer = new ChromePdfRenderer();
renderer.RenderingOptions.EnableJavaScript = true;
renderer.RenderingOptions.WaitFor.RenderDelay(1000);
renderer.RenderingOptions.CssMediaType = PdfCssMediaType.Screen;
var pdf = renderer.RenderUrlAsPdf("https://en.wikipedia.org/wiki/PDF");
pdf.SaveAs("webpage.pdf");

var renderer = new ChromePdfRenderer();
renderer.RenderingOptions.EnableJavaScript = true;
renderer.RenderingOptions.WaitFor.RenderDelay(1000);
renderer.RenderingOptions.CssMediaType = PdfCssMediaType.Screen;
var pdf = renderer.RenderUrlAsPdf("https://en.wikipedia.org/wiki/PDF");
pdf.SaveAs("webpage.pdf");

Dim renderer = New ChromePdfRenderer()
renderer.RenderingOptions.EnableJavaScript = True
renderer.RenderingOptions.WaitFor.RenderDelay(1000)
renderer.RenderingOptions.CssMediaType = PdfCssMediaType.Screen
Dim pdf = renderer.RenderUrlAsPdf("https://en.wikipedia.org/wiki/PDF")
pdf.SaveAs("webpage.pdf")

Opcja WaitFor.RenderDelay nakazuje rendererowi wstrzymanie się po załadowaniu strony przed przechwyceniem. Jest to przydatne w przypadku aplikacji jednostronicowych, które budują swój DOM za pomocą JavaScript po otrzymaniu początkowej odpowiedzi HTML. Ustawienie EnableJavaScript = true aktywuje pełny silnik JavaScript przeglądarki Chrome, dzięki czemu wykresy, tabele danych i inne elementy renderowane przez JavaScript pojawiają się w pliku PDF tak samo, jak w przeglądarce.

Jak wygląda interfejs formularza?

Jak dane formularza pojawiają się w wygenerowanym pliku PDF?

W przypadku bardziej zaawansowanych scenariuszy dokumentów można zintegrować formularze PDF lub edytować istniejące szablony PDF z wstępnie wypełnionymi polami. Biblioteka obsługuje również podpisy cyfrowe dla dokumentów prawnych i umów, umożliwiając dodawanie podpisów weryfikowalnych kryptograficznie do każdego wygenerowanego dokumentu.

Ważną kwestią przy osadzaniu danych użytkownika w ciągach HTML jest ich oczyszczanie. Zawsze należy stosować escape w ciągach znaków dostarczonych przez użytkownika przed wstawieniem ich do kodu HTML, aby zapobiec problemom związanym z wstrzyknięciem kodu. Proste wywołanie System.Web.HttpUtility.HtmlEncode(model.CustomerName) w każdym polu zapewnia bezpieczeństwo szablonu przed przekazaniem go do renderera.

Jak skonfigurować nagłówki, stopki i znaki wodne?

Profesjonalne dokumenty PDF często wymagają nagłówków i stopek na każdej stronie, a także znaków wodnych w przypadku dokumentów roboczych lub poufnych. IronPDF obsługuje zarówno właściwości obiektu RenderingOptions, jak i metodę ApplyWatermark w wynikowym PdfDocument:

var renderer = new ChromePdfRenderer();
renderer.RenderingOptions.HtmlHeader = new HtmlHeaderFooter
{
    MaxHeight = 25,
    HtmlFragment = "<div style='text-align:center'>Annual Report 2024</div>"
};
renderer.RenderingOptions.HtmlFooter = new HtmlHeaderFooter
{
    MaxHeight = 20,
    HtmlFragment = "<div style='text-align:center'>Page {page} of {total-pages}</div>"
};
var pdf = renderer.RenderHtmlAsPdf(htmlContent);
pdf.ApplyWatermark("<h2 style='color:red;opacity:0.3'>CONFIDENTIAL</h2>",
    30, VerticalAlignment.Middle, HorizontalAlignment.Center);
pdf.SaveAs("report-with-watermark.pdf");

var renderer = new ChromePdfRenderer();
renderer.RenderingOptions.HtmlHeader = new HtmlHeaderFooter
{
    MaxHeight = 25,
    HtmlFragment = "<div style='text-align:center'>Annual Report 2024</div>"
};
renderer.RenderingOptions.HtmlFooter = new HtmlHeaderFooter
{
    MaxHeight = 20,
    HtmlFragment = "<div style='text-align:center'>Page {page} of {total-pages}</div>"
};
var pdf = renderer.RenderHtmlAsPdf(htmlContent);
pdf.ApplyWatermark("<h2 style='color:red;opacity:0.3'>CONFIDENTIAL</h2>",
    30, VerticalAlignment.Middle, HorizontalAlignment.Center);
pdf.SaveAs("report-with-watermark.pdf");

Imports IronPdf

Dim renderer As New ChromePdfRenderer()
renderer.RenderingOptions.HtmlHeader = New HtmlHeaderFooter With {
    .MaxHeight = 25,
    .HtmlFragment = "<div style='text-align:center'>Annual Report 2024</div>"
}
renderer.RenderingOptions.HtmlFooter = New HtmlHeaderFooter With {
    .MaxHeight = 20,
    .HtmlFragment = "<div style='text-align:center'>Page {page} of {total-pages}</div>"
}
Dim pdf = renderer.RenderHtmlAsPdf(htmlContent)
pdf.ApplyWatermark("<h2 style='color:red;opacity:0.3'>CONFIDENTIAL</h2>", 30, VerticalAlignment.Middle, HorizontalAlignment.Center)
pdf.SaveAs("report-with-watermark.pdf")

Symbole zastępcze {page} i {total-pages} w kodzie HTML stopki są automatycznie zastępowane w momencie renderowania, dzięki czemu otrzymujesz prawidłowe numery stron bez konieczności dodatkowej obróbki. Można również dodać numery stron, obrazy tła lub nakładki na pierwszym planie oraz niestandardowe tekstowe lub graficzne stemple.

Jak korzystać z CSS Print Media do sterowania układem plików PDF?

Aby zapewnić zgodność pliku PDF z oczekiwaniami, należy użyć reguł CSS @media print oraz ustawienia PdfCssMediaType.Print. IronPDF w pełni obsługuje kontrolę podziału stron i niestandardowe rozmiary papieru:

var renderer = new ChromePdfRenderer();
renderer.RenderingOptions.CssMediaType = PdfCssMediaType.Print;
renderer.RenderingOptions.ViewPortWidth = 1024;
renderer.RenderingOptions.MarginTop = 10;
renderer.RenderingOptions.MarginBottom = 10;
renderer.RenderingOptions.MarginLeft = 10;
renderer.RenderingOptions.MarginRight = 10;
string html = @"
    <style>
        @media print {
            .no-print { display: none; }
            body { font-size: 12pt; }
            .page-break { page-break-after: always; }
        }
        @page {
            size: A4;
            margin: 1cm;
        }
    </style>
    <div class='content'>
        <h1>Professional Report</h1>
        <div class='page-break'></div>
        <h2>Section 2</h2>
    </div>";
var pdf = renderer.RenderHtmlAsPdf(html);

var renderer = new ChromePdfRenderer();
renderer.RenderingOptions.CssMediaType = PdfCssMediaType.Print;
renderer.RenderingOptions.ViewPortWidth = 1024;
renderer.RenderingOptions.MarginTop = 10;
renderer.RenderingOptions.MarginBottom = 10;
renderer.RenderingOptions.MarginLeft = 10;
renderer.RenderingOptions.MarginRight = 10;
string html = @"
    <style>
        @media print {
            .no-print { display: none; }
            body { font-size: 12pt; }
            .page-break { page-break-after: always; }
        }
        @page {
            size: A4;
            margin: 1cm;
        }
    </style>
    <div class='content'>
        <h1>Professional Report</h1>
        <div class='page-break'></div>
        <h2>Section 2</h2>
    </div>";
var pdf = renderer.RenderHtmlAsPdf(html);

Imports IronPdf

Dim renderer As New ChromePdfRenderer()
renderer.RenderingOptions.CssMediaType = PdfCssMediaType.Print
renderer.RenderingOptions.ViewPortWidth = 1024
renderer.RenderingOptions.MarginTop = 10
renderer.RenderingOptions.MarginBottom = 10
renderer.RenderingOptions.MarginLeft = 10
renderer.RenderingOptions.MarginRight = 10

Dim html As String = "
    <style>
        @media print {
            .no-print { display: none; }
            body { font-size: 12pt; }
            .page-break { page-break-after: always; }
        }
        @page {
            size: A4;
            margin: 1cm;
        }
    </style>
    <div class='content'>
        <h1>Professional Report</h1>
        <div class='page-break'></div>
        <h2>Section 2</h2>
    </div>"

Dim pdf = renderer.RenderHtmlAsPdf(html)

Zastosowanie CSS do drukowania gwarantuje, że dokumenty PDF zachowają profesjonalne formatowanie, jednocześnie ukrywając zbędne elementy stron internetowych, takie jak menu nawigacyjne czy interaktywne przyciski. Ustawienie CssMediaType = PdfCssMediaType.Print nakazuje rendererowi zastosowanie reguł @media print zamiast stylów ekranowych, co zazwyczaj usuwa dekoracje tła i dostosowuje typografię do wydruku PRINT. Można również skonfigurować niestandardowe marginesy dla każdej strony oraz kontrolować orientację i obrót strony w przypadku raportów w formacie szerokim lub obróconych.

Specyfikacja W3C CSS Paged Media określa, jak właściwości takie jak @page, page-break-before i widows powinny zachowywać się w wydruku stroniczonym. Silnik IronPDF dla przeglądarki Chrome ściśle przestrzega tej specyfikacji, dzięki czemu style napisane zgodnie ze standardem CSS są dokładnie przekładane do pliku PDF bez konieczności ręcznych poprawek.