Verwenden der WaitFor-Klasse zum Verzögern der C#-PDF-Rendering
Beim Rendering von PDF-Dokumenten tritt häufig das Problem auf, dass der Rendering-Prozess stattfindet, bevor alle notwendigen Assets und Animationen von JavaScript geladen sind. Dies kann dazu führen, dass das PDF-Dokument unvollständig oder fehlerhaft wiedergegeben wird. Ursprünglich haben wir dieses Problem gelöst, indem wir dem Benutzer die Möglichkeit gaben, eine beliebige Verzögerung einzustellen. Sich auf eine willkürliche Verzögerung zu verlassen, ist jedoch kein zuverlässiger oder effizienter Ansatz.
Um eine robustere Lösung zu bieten, haben wir eine WaitFor-Klasse implementiert, die den PDF-Rendering-Prozess verbessert. Das WaitFor-Objekt von RenderOptions bietet mehrere Optionen, darunter:
PageLoad: Standard-Rendering ohne Warten.RenderDelay: Einstellen einer beliebigen Wartezeit.Schriftarten: Wartet, bis alle Schriftarten geladen sind.JavaScript: Auslösen des Renderings mit einer JavaScript-Funktion.HTML-Elemente: Wartet auf bestimmte HTML-Elemente, wie Element-IDs, Namen, Tag-Namen und Abfrage-Selektoren, um Elemente anzuvisieren.NetworkIdle: Warten auf Netzwerk im Leerlauf (0, 2 oder ein benutzerdefinierter Wert).Diese Funktionen sind für die Konvertierung verfügbarHTML-Strings in PDF mit IronPDF, HTML-Dateien in PDF mit IronPDFundweb-URLs in PDF mit IronPDF. Schauen wir uns die wichtigsten Aspekte dieser neuen Funktion an.
Verwenden von WaitFor zum Verzögern des PDF-Renderns in C#
- Laden Sie die C# IronPDF-Bibliothek herunter, um das PDF-Rendering zu verzögern
- Erzeugen eines PDF-Dokuments aus einem HTML-String, einer Datei oder einer Web-URL
- Verwenden Sie die JavaScript-Methode WaitFor, um das Rendering über eine JavaScript-Funktion auszulösen
- Verzögern Sie das Rendern je nach der Anzahl der Netzwerkaktivitäten
- Warten auf bestimmte HTML-Elemente als auch für alle zu ladenden Schriftarten
Erste Schritte mit IronPDF
Beginnen Sie noch heute mit der Verwendung von IronPDF in Ihrem Projekt mit einer kostenlosen Testversion.
Beispiel für standardmäßiges sofortiges Rendern
Standardmäßig erfolgt der Rendering-Prozess unmittelbar nach dem Laden der Seite. Die Methode PageLoad muss nicht aufgerufen werden, wenn Sie normal rendern wollen.
:path=/static-assets/pdf/content-code-examples/how-to/waitfor-pageload.csusing IronPdf;
ChromePdfRenderer renderer = new ChromePdfRenderer();
// Render as soon as the page is loaded
renderer.RenderingOptions.WaitFor.PageLoad();
PdfDocument pdf = renderer.RenderHtmlAsPdf("<h1>testing</h1>");IRON VB CONVERTER ERROR developers@ironsoftware.comBeispiel für eine benutzerdefinierte Renderverzögerung
In Situationen, in denen eine bestimmte Verzögerung vor dem Rendern der PDF-Datei erforderlich ist, können Sie eine beliebige Anzahl von Millisekunden als Verzögerung festlegen. Dies ermöglicht eine flexible Anpassung an spezifische zeitliche Anforderungen.
Diese Option funktioniert auf dieselbe Weise wie die alte Implementierung, die die Eigenschaft RenderingOptions.RenderDelay verwendet. Die alte Eigenschaft ist jedoch veraltet, und es wird dringend empfohlen, die neue API, RenderingOptions.WaitFor.RenderDelay, zu verwenden.
:path=/static-assets/pdf/content-code-examples/how-to/waitfor-delay-time.csusing IronPdf;
ChromePdfRenderer renderer = new ChromePdfRenderer();
// Render after 3000ms
renderer.RenderingOptions.WaitFor.RenderDelay(3000);
PdfDocument pdf = renderer.RenderHtmlAsPdf("<h1>testing</h1>");Imports IronPdf
Private renderer As New ChromePdfRenderer()
' Render after 3000ms
renderer.RenderingOptions.WaitFor.RenderDelay(3000)
Dim pdf As PdfDocument = renderer.RenderHtmlAsPdf("<h1>testing</h1>")Alle Schriftarten geladen Beispiel
Die AllFontsLoaded methode in der WaitFor ermöglicht es, den PDF-Rendering-Prozess zu unterbrechen, bis alle Schriften von externen Quellen wie Google Fonts oder anderen Servern geladen sind. Auf diese Weise wird sichergestellt, dass die endgültige PDF-Datei alle erforderlichen Schriftarten enthält und die beabsichtigte Typografie und das visuelle Erscheinungsbild des Dokuments erhalten bleiben.
:path=/static-assets/pdf/content-code-examples/how-to/waitfor-all-fonts.csusing IronPdf;
string htmlContent = @"
<!DOCTYPE html>
<html lang=""en"">
<head>
<meta charset=""UTF-8"">
<title>Test Registration of Extension</title>
<!-- for google web fonts -->
<link rel=""preconnect"" href=""https://fonts.googleapis.com"">
<link rel=""preconnect"" href=""https://fonts.gstatic.com"" crossorigin>
<link rel=""stylesheet"" href=""https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap"" >
<style>
/* for remote fonts */
@font-face {
font-family: 'CustomFont';
src: url('https://stage.gradfinale.co.uk/tcpdf/fonts/avgr65wttf.ttf');
}
p#p1 { font-family: CustomFont, sans-serif; }
/* for local fonts */
@font-face {
font-family: 'LocalCustomFont';
src: local('Arial');
}
p#p3 { font-family: LocalCustomFont, sans-serif; }
</style>
</head>
<body>
<h1>This is Delayed Render Test!</h1>
<p style=""font-family: Roboto, monospace;"">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla scelerisque ligula venenatis erat <strong>scelerisque</strong> auctor.</p>
<p id=""p1"">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla scelerisque ligula venenatis erat <strong>scelerisque</strong> auctor.</p>
<p id=""p3"">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla scelerisque ligula venenatis erat <strong>scelerisque</strong> auctor.</p>
</body>
</html>)";
ChromePdfRenderer renderer = new ChromePdfRenderer();
renderer.RenderingOptions.WaitFor.AllFontsLoaded(10000);
PdfDocument pdf = renderer.RenderHtmlAsPdf(htmlContent);IRON VB CONVERTER ERROR developers@ironsoftware.comBeispiel für benutzerdefinierte JavaScript-Ausführung
Um mehr Kontrolle über den Rendering-Prozess zu haben, können Sie eine benutzerdefinierte JavaScript-Funktion angeben, die vor dem Rendering des PDF-Dokuments ausgeführt werden muss. Auf diese Weise können Sie alle notwendigen Aufgaben oder Prüfungen durchführen, bevor Sie den Rendering-Prozess einleiten. So kann der Benutzer selbst bestimmen, wann der Rendervorgang ausgelöst werden soll.
In JavaScript wird die Funktion "window.ironpdf.notifyRender()wird verwendet, um die Rendering-Aufgabe auszulösen. SobaldnotifyRender()` aufgerufen wird, wird der Rendering-Prozess gestartet. Sie haben die volle Kontrolle darüber, wann die Funktion aufgerufen werden soll.
:path=/static-assets/pdf/content-code-examples/how-to/waitfor-javascript.csusing IronPdf;
string html = @"<!DOCTYPE html>
<html>
<body>
<h1>Testing</h1>
<script type='text/javascript'>
// Set delay
setTimeout(function() {
window.ironpdf.notifyRender();
}, 1000);
</script>
</body>
</html>";
ChromePdfRenderOptions renderingOptions = new ChromePdfRenderOptions();
// Set rendering to wait for the notifyRender function
renderingOptions.WaitFor.JavaScript(5000);
PdfDocument pdf = ChromePdfRenderer.StaticRenderHtmlAsPdf(html, renderingOptions);IRON VB CONVERTER ERROR developers@ironsoftware.comHTML-Elemente Beispiel
Mit dieser Option kann der Rendering-Prozess so eingestellt werden, dass er auf bestimmte HTML-Elemente wartet, z. B. auf Element-IDs, Namen, Tag-Namen und sogar auf die Verwendung von Abfrage-Selektoren, um Elemente anzuvisieren.
Warten auf Element-ID
Im folgenden Code-Beispiel wartet das Rendering auf eine bestimmte Element-ID.
:path=/static-assets/pdf/content-code-examples/how-to/waitfor-html-element-id.csusing IronPdf;
string htmlContent = @"
<!DOCTYPE html>
<html lang=""en"">
<head>
<meta charset=""UTF-8"">
<title>Delayed render tests</title>
<script type=""text/javascript"">
setTimeout(function() {
var h1Tag = document.createElement(""h1"");
h1Tag.innerHTML = ""bla bla bla"";
h1Tag.setAttribute(""id"", ""myid"");
var block = document.querySelector(""div#x"");
block.appendChild(h1Tag);
}, 1000);
</script>
</head>
<body>
<h1>This is Delayed Render Test!</h1>
<div id=""x""></div>
</body>
</html>";
ChromePdfRenderer renderer = new ChromePdfRenderer();
renderer.RenderingOptions.WaitFor.HtmlElementById("myid", 5000);
PdfDocument pdf = renderer.RenderHtmlAsPdf(htmlContent);IRON VB CONVERTER ERROR developers@ironsoftware.comWarten auf Elementname
Im folgenden Codebeispiel wartet der Rendering-Prozess auf ein bestimmtes Element Name.
:path=/static-assets/pdf/content-code-examples/how-to/waitfor-html-element-name.csusing IronPdf;
string htmlContent = @"
<!DOCTYPE html>
<html lang=""en"">
<head>
<meta charset=""UTF-8"">
<title>Delayed render tests</title>
<script type=""text/javascript"">
setTimeout(function() {
var h1Tag = document.createElement(""h1"");
h1Tag.innerHTML = ""bla bla bla"";
h1Tag.setAttribute(""name"", ""myName"");
var block = document.querySelector(""div#x"");
block.appendChild(h1Tag);
}, 1000);
</script>
</head>
<body>
<h1>This is Delayed Render Test!</h1>
<div id=""x""></div>
</body>
</html>";
ChromePdfRenderer renderer = new ChromePdfRenderer();
renderer.RenderingOptions.WaitFor.HtmlElementByName("myName", 5000);
PdfDocument pdf = renderer.RenderHtmlAsPdf(htmlContent);IRON VB CONVERTER ERROR developers@ironsoftware.comWarten auf Element Tag Name
Im folgenden Codebeispiel wartet der Rendering-Prozess auf den Namen eines bestimmten Element-Tags.
:path=/static-assets/pdf/content-code-examples/how-to/waitfor-html-element-tag-name.csusing IronPdf;
string htmlContent = @"
<!DOCTYPE html>
<html lang=""en"">
<head>
<meta charset=""UTF-8"">
<title>Delayed render tests</title>
<script type=""text/javascript"">
setTimeout(function() {
var newElem = document.createElement(""h2"");
newElem.innerHTML = ""bla bla bla"";
var block = document.querySelector(""div#x"");
block.appendChild(newElem);
}, 1000);
</script>
</head>
<body>
<h1>This is Delayed Render Test!</h1>
<div id=""x""></div>
</body>
</html>";
ChromePdfRenderer renderer = new ChromePdfRenderer();
renderer.RenderingOptions.WaitFor.HtmlElementByTagName("h2", 5000);
PdfDocument pdf = renderer.RenderHtmlAsPdf(htmlContent);IRON VB CONVERTER ERROR developers@ironsoftware.comAbfrage-Selektor verwenden
Im folgenden Codebeispiel wartet der Rendering-Prozess auf das Element, das durch den Abfrage-Selektor ausgewählt wurde. Die Methode "HtmlQuerySelector" wartet auf ein img tag mit der id 'myid' und der class 'blablastyle'.
:path=/static-assets/pdf/content-code-examples/how-to/waitfor-html-element-query-selector.csusing IronPdf;
string htmlContent = @"
<!DOCTYPE html>
<html lang=""en"">
<head>
<meta charset=""UTF-8"">
<title>Test Registration of Extension</title>
<script type=""text/javascript"">
setTimeout(function() {
var img = document.createElement(""img"");
img.onload = function() {
img.setAttribute(""id"", ""myid"");
img.setAttribute(""class"", ""blablastyle"");
var block = document.getElementById(""x"");
block.appendChild(img);
};
img.src = ""https://www.w3schools.com/images/picture.jpg""; // .src after .onload to ignore cached, if any
}, 1000);
</script>
</head>
<body>
<h1>This is Delayed Render Test!</h1>
<div id=""x""></div>
</body>
</html>";
ChromePdfRenderer renderer = new ChromePdfRenderer();
renderer.RenderingOptions.WaitFor.HtmlQuerySelector("img#myid.blablastyle", 5000);
PdfDocument pdf = renderer.RenderHtmlAsPdf(htmlContent);IRON VB CONVERTER ERROR developers@ironsoftware.comBeispiel für Leerlauf im Netzwerk
Keine Netzwerkaktivität
Bei dieser Art von Netzleerlauf können Sie warten, bis keine Netzaktivität mehr stattfindet, was in der Regel bedeutet, dass der Inhalt vollständig geladen wurde. Dies ist für eine Single-Page-Anwendung geeignet(SPA) oder eine einfache Webseite, die keine langwierigen Netzwerkanfragen oder laufende Netzwerkaktivitäten aufweist.
Der Rendering-Vorgang beginnt erst, wenn mindestens 500ms lang keine Netzwerkaktivität stattgefunden hat.
:path=/static-assets/pdf/content-code-examples/how-to/waitfor-network-idle-0.csusing IronPdf;
ChromePdfRenderer renderer = new ChromePdfRenderer();
// Render unless there has been no network activity for at least 500ms
renderer.RenderingOptions.WaitFor.NetworkIdle0();
PdfDocument pdf = renderer.RenderHtmlAsPdf("<h1>testing</h1>");IRON VB CONVERTER ERROR developers@ironsoftware.comZwei Netzwerkaktivitäten sind erlaubt
Die "NetworkIdle2"-Methode eignet sich für Webanwendungen oder Webseiten, die langwierige Netzwerkanfragen oder Heartbeat-Pings haben. In der Regel handelt es sich um 1-2 Anfragen. In diesem Fall werden diese Anfragen, auch wenn sie noch laufen, nicht als ungültig für die Auslösung des Ereignisses "Netzstillstand" betrachtet, da höchstens zwei davon zulässig sind.
Vor dem Start des Rendering-Prozesses sollten höchstens zwei Netzwerkaktivitäten für mindestens 500ms verbleiben. Diese Option bietet eine schnelle Konfiguration für die Handhabung einer festen Anzahl von Netzwerkaktivitäten.
:path=/static-assets/pdf/content-code-examples/how-to/waitfor-network-idle-2.csusing IronPdf;
ChromePdfRenderer renderer = new ChromePdfRenderer();
// Render unless there are at most 2 network activities for at least 500ms
renderer.RenderingOptions.WaitFor.NetworkIdle2();
PdfDocument pdf = renderer.RenderHtmlAsPdf("<h1>testing</h1>");IRON VB CONVERTER ERROR developers@ironsoftware.comErlaubte Netzwerkaktivitäten anpassen
In Fällen, in denen mehrere Netzwerkanfragen involviert sind, haben Sie die Möglichkeit, sowohl die Netzwerk-Idle-Dauer als auch die Anzahl der erlaubten Netzwerk-Anfragen, die das Auslösen des Netzwerk-Idle-Ereignisses nicht ungültig machen, anzupassen. Diese Option eignet sich für Webanwendungen oder Webseiten mit spezifischen Anforderungen, die nicht zu den beiden vorherigen Methoden passen. Durch diese Anpassung stellen wir sicher, dass wir ein breites Spektrum von Anwendungsfällen unter verschiedenen Umständen abdecken.
:path=/static-assets/pdf/content-code-examples/how-to/waitfor-customize-network.csusing IronPdf;
ChromePdfRenderer renderer = new ChromePdfRenderer();
// Render unless there are at most 5 network activities for at least 1000ms
renderer.RenderingOptions.WaitFor.NetworkIdle(1000, 5);
PdfDocument pdf = renderer.RenderHtmlAsPdf("<h1>testing</h1>");Imports IronPdf
Private renderer As New ChromePdfRenderer()
' Render unless there are at most 5 network activities for at least 1000ms
renderer.RenderingOptions.WaitFor.NetworkIdle(1000, 5)
Dim pdf As PdfDocument = renderer.RenderHtmlAsPdf("<h1>testing</h1>")Maximale Wartezeit einstellen
Darüber hinaus können Sie mit den Methoden JavaScript, NetworkIdle, NetworkIdle0 und NetworkIdle2 auch eine maximale Wartezeit festlegen, um sicherzustellen, dass die Wartezeit nicht unendlich ist. Der Parameter maxWaitTime dieser Methoden kann zu diesem Zweck verwendet werden.
Bitte beachten Sie
