Using the C# WaitFor Class to Delay PDF Rendering
IronPDF 中的 C# WaitFor 類別協助開發人員在所有資源、字型和 JavaScript 載入完成後再延遲 PDF 渲染,防止不完整渲染,通過 NetworkIdle 和 JavaScript 觸發器等方法實現。
⟨AH2BG⟩快速入門:使用 WaitFor 提高 PDF 渲染⟨AH2EG⟩
IronPDF 的 WaitFor 功能允許開發人員通過管理異步計時來提升 PDF 渲染。 通過設定像 RenderDelay 這樣的選項,您可以確保在轉換之前所有資源和腳本已載入,防止不完整 PDF 文件。 本指南展示如何在您的專案中實施 WaitFor ,以實現精確和高效的渲染。
:path=/static-assets/pdf/content-code-examples/how-to/waitfor-1.cs
new IronPdf.ChromePdfRenderer { RenderingOptions = { WaitFor = IronPdf.WaitFor.RenderDelay(3000) } }
.RenderUrlAsPdf("https://example.com")
.SaveAs("output.pdf");
Imports IronPdf
Dim renderer As New ChromePdfRenderer With {
.RenderingOptions = New ChromePdfRenderOptions With {
.WaitFor = WaitFor.RenderDelay(3000)
}
}
renderer.RenderUrlAsPdf("https://example.com").SaveAs("output.pdf")
簡化工作流程(5個步驟)
- 下載 C# IronPDF 程式庫以延遲 PDF 渲染
- 從 HTML 字串、檔案或網頁 URL 產生 PDF 文件
- 使用 JavaScript 的
WaitFor方法從 JavaScript 函式觸發渲染 - 根據網路活動數量延遲渲染
- 等待特定的 HTML 元素以及所有字體的載入
WaitFor 類別及其選項是什麼?
為了以最佳效能渲染 PDF,WaitFor 類別改善了 PDF 渲染過程。 WaitFor 物件來自 RenderOptions ,提供了幾個選項:
PageLoad:預設渲染,不需等待。RenderDelay:設定任意等待時間。Fonts:等待直到所有字體載入完畢。JavaScript:通過 JavaScript 函式觸發渲染。HTML elements:等待特定的 HTML 元素,例如元素 ID、名稱、標籤名和查詢選擇器,來鎖定目標元素。NetworkIdle:等待網路空閒(0、2 或自定義數量)。
這些功能適用於將HTML 字串轉換為 PDF,HTML 文件轉換為 PDF,以及網站 URL 轉換為 PDF。
如何立即渲染 PDF 而不等待?
預設情況下,渲染會在頁面載入完成後立即發生。 正常渲染不需要調用 PageLoad 方法。 這種方法適合不包含複雜 JavaScript 或外部資源的簡單 HTML 內容。
:path=/static-assets/pdf/content-code-examples/how-to/waitfor-pageload.cs
using IronPdf;
ChromePdfRenderer renderer = new ChromePdfRenderer();
// Render as soon as the page is loaded
renderer.RenderingOptions.WaitFor.PageLoad();
PdfDocument pdf = renderer.RenderHtmlAsPdf("<h1>testing</h1>");
Imports IronPdf
Dim renderer As New ChromePdfRenderer()
' Render as soon as the page is loaded
renderer.RenderingOptions.WaitFor.PageLoad()
Dim pdf As PdfDocument = renderer.RenderHtmlAsPdf("<h1>testing</h1>")
如何在 PDF 渲染前新增自定義延遲?
當需要特定延遲來渲染 PDF 時,您可以設定一個任意毫秒數作為延遲。 這為特定時間要求提供了靈活性,特別是當處理JavaScript 內容繁重時。
此選項的工作方式與舊實作使用的 RenderingOptions.RenderDelay 屬性相同。 然而,舊屬性已被棄用。 使用新的 API:RenderingOptions.WaitFor.RenderDelay。
:path=/static-assets/pdf/content-code-examples/how-to/waitfor-delay-time.cs
using 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>")
當您的 HTML 包含動畫、延遲載入內容或需要動態內容生成的時間時,延遲機制很有用。 對於複雜的渲染情況,探索自定義渲染選項。
如何在渲染之前等待所有字體載入?
在 WaitFor 類別中的 AllFontsLoaded 方法暫停 PDF 渲染,直到所有字體從外部資源(如 Google 字體)載入完成。 這確保了最終的 PDF 包含所有必要字體,保留了文件的預期排版和視覺外觀。 此功能維持專業的 PDF 輸出品質。
:path=/static-assets/pdf/content-code-examples/how-to/waitfor-all-fonts.cs
using 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);
Imports IronPdf
Dim htmlContent As String = "
<!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>"
Dim renderer As New ChromePdfRenderer()
renderer.RenderingOptions.WaitFor.AllFontsLoaded(10000)
Dim pdf As PdfDocument = renderer.RenderHtmlAsPdf(htmlContent)
欲了解有關 PDF 字體管理的更多資訊,包括嵌入和子設定選項,請查閱PDF 字體管理指南。
如何使用自定義 JavaScript 觸發 PDF 渲染?
為了更好地控制渲染過程,您可以指定在渲染 PDF 文件之前執行的自定義 JavaScript 函式。 這使您可以執行必要的任務或檢查,再開始渲染過程,讓您控制何時觸發渲染。
在 JavaScript 中,函式 window.ironpdf.notifyRender() 觸發渲染任務。 一旦調用 notifyRender(),渲染過程就會開始。 您可以控制何時調用該函式。
:path=/static-assets/pdf/content-code-examples/how-to/waitfor-javascript.cs
using 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);
當與 AJAX 請求結合使用,或確保動態生成的內容在渲染之前完全載入時,這種方法效果很好。 有關高級 JavaScript 場景,請參閱在 PDF 中執行自定義 JavaScript指南。
如何在渲染之前等待特定的 HTML 元素?
使用此選項,渲染過程會等待特定的 HTML 元素,例如元素 ID、名稱、標籤名和查詢選擇器來定位元素。 此功能在處理單頁應用程式(SPAs)或異步載入的內容時很有幫助。
如何通過 ID 等待元素?
在下方程式碼範例中,渲染會等待特定元素 ID。
:path=/static-assets/pdf/content-code-examples/how-to/waitfor-html-element-id.cs
using 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);
Imports IronPdf
Dim htmlContent As String = "
<!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>"
Dim renderer As New ChromePdfRenderer()
renderer.RenderingOptions.WaitFor.HtmlElementById("myid", 5000)
Dim pdf As PdfDocument = renderer.RenderHtmlAsPdf(htmlContent)
如何通過姓名屬性等待元素?
在下方程式碼範例中,渲染過程會等待特定元素名稱。
:path=/static-assets/pdf/content-code-examples/how-to/waitfor-html-element-id.cs
using 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);
Imports IronPdf
Dim htmlContent As String = "
<!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>"
Dim renderer As New ChromePdfRenderer()
renderer.RenderingOptions.WaitFor.HtmlElementById("myid", 5000)
Dim pdf As PdfDocument = renderer.RenderHtmlAsPdf(htmlContent)
如何通過標籤名等待元素?
在下方程式碼範例中,渲染過程會等待特定元素的標籤名。
:path=/static-assets/pdf/content-code-examples/how-to/waitfor-html-element-tag-name.cs
using 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);
Imports IronPdf
Dim htmlContent As String = "
<!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>"
Dim renderer As New ChromePdfRenderer()
renderer.RenderingOptions.WaitFor.HtmlElementByTagName("h2", 5000)
Dim pdf As PdfDocument = renderer.RenderHtmlAsPdf(htmlContent)
如何使用查詢選擇器等待元素?
在下方程式碼範例中,渲染過程會等待使用查詢選擇器選擇的元素。 HtmlQuerySelector 方法等待有 img tag 和 id of 'myid' 的 class of 'blablastyle'。
:path=/static-assets/pdf/content-code-examples/how-to/waitfor-html-element-query-selector.cs
using 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);
Imports IronPdf
Dim htmlContent As String = "
<!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>"
Dim renderer As New ChromePdfRenderer()
renderer.RenderingOptions.WaitFor.HtmlQuerySelector("img#myid.blablastyle", 5000)
Dim pdf As PdfDocument = renderer.RenderHtmlAsPdf(htmlContent)
如何等待網路活動完成?
在渲染為資源、資料或 API 呼叫而執行的網頁時,確保所有網路活動完成後再生成 PDF。 IronPDF 提供了幾種方法來處理不同的網路情況。
什麼時候應等待零網路活動?
這種型別的網路空閒等待直到沒有網路活動,通常表明內容已經完全載入。 這適合沒有長輪詢網路請求或持續網路活動的單頁應用程式(SPAs)或簡單網頁。
一旦在 至少 500ms 內沒有持續的網路活動,渲染過程就開始。
:path=/static-assets/pdf/content-code-examples/how-to/waitfor-network-idle-0.cs
using 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>");
Imports IronPdf
Dim renderer As New ChromePdfRenderer()
' Render unless there has been no network activity for at least 500ms
renderer.RenderingOptions.WaitFor.NetworkIdle0()
Dim pdf As PdfDocument = renderer.RenderHtmlAsPdf("<h1>testing</h1>")
什麼時候應允許兩次網路活動?
NetworkIdle2 方法適合有長輪詢網路請求或心跳信號的網頁應用程式或網頁。 通常涉及 1-2 個請求。 即使這些請求正在進行中,它們不會失效觸發網路空閒事件,因為具有最多兩個是可以接受的。
在啟動渲染過程之前,應該有 至多兩個網路活動 在下方的 至少 500ms 內。 此選項提供快速配置,以處理固定數量的網路活動。
:path=/static-assets/pdf/content-code-examples/how-to/waitfor-network-idle-2.cs
using 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>");
Imports IronPdf
Dim renderer As New ChromePdfRenderer()
' Render unless there are at most 2 network activities for at least 500ms
renderer.RenderingOptions.WaitFor.NetworkIdle2()
Dim pdf As PdfDocument = renderer.RenderHtmlAsPdf("<h1>testing</h1>")
如何自訂網路活動閾值?
當涉及多個網路請求時,您可以自訂網路空閒持續時間和允許的網路請求數量,這不會失效網路空閒事件。 此選項適合有特定需求不符合前兩種方法的網頁應用程式或網頁。 此自訂可以在不同情況下滿足廣泛的使用案例。
:path=/static-assets/pdf/content-code-examples/how-to/waitfor-customize-network.cs
using 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>")
當處理保留持續連接或有可預測背景網路活動模式的複雜 Web 應用程式時,這種定制級別非常有用。
如何設置最大等待時間?
NetworkIdle0 和 NetworkIdle2 方法允許您設定最大等待時間,以確保等待不會無限期。maxWaitTime 參數用於此目的。 如果預期條件從未發生,這可以防止您的應用程式無限期掛起。
所有指定的時間值都是以毫秒為單位。
在實施這些等待策略時,在確保完整內容載入與保持合理性能之間取得平衡。 對於需要精確時間控制的應用程式,探索非同步 PDF 生成技術。
準備好瞭解您還可以做什麼嗎? 請查看此教學頁面:其他功能或探索使用 IronPDF 建立 PDF來獲取更高級的技術。
常見問題
什麼是 WaitFor 課堂及為什麼我應該使用它?
IronPDF 中的 WaitFor 課堂允許開發者延遲 PDF 渲染,直到所有資產、字體和 JavaScript 載入完成。這可以防止不完整的渲染,並確保複雜的網頁在轉換為 PDF 之前完全載入,從而產生更準確和完整的 PDF 文件。
有哪些不同的 WaitFor 選項可用?
IronPDF 的 WaitFor 課堂提供幾個選項:PageLoad(預設立即渲染)、RenderDelay(以毫秒為單位的自定義延遲)、Fonts(等待所有字體載入)、JavaScript(透過 JavaScript 函式觸發渲染)、HTML 元素(根據 ID、名稱、標籤或查詢選擇器等待特定元素),以及 NetworkIdle(等待網路活動停止)。
如何在 PDF 渲染之前新增自定義延遲?
您可以使用 IronPDF 中的 RenderDelay 方法新增自定義延遲。只需指定以毫秒為單位的延遲:`new ChromePdfRenderer { RenderingOptions = { WaitFor = WaitFor.RenderDelay(3000) } }`。這特別適用於需要額外執行時間的 JavaScript 密集內容。
我可以在渲染之前等待特定的 HTML 元素載入嗎?
是的,IronPDF 允許您使用元素 ID、名稱、標籤名稱或查詢選擇器等待特定的 HTML 元素。這確保在 PDF 轉換開始之前,頁面上的關鍵內容已存在,防止最終 PDF 文件中元素遺失。
什麼是 NetworkIdle,我應該什麼時候使用它?
IronPDF 中的 NetworkIdle 在渲染 PDF 之前等候網路活動停止。您可以將其設置為等待 0、2 或自定義數量的網路連接。這非常適合通過 AJAX 調用或其他非同步網路請求載入內容的頁面。
如何從 JavaScript 觸發 PDF 渲染?
IronPDF 的 WaitFor JavaScript 選項允許您從 JavaScript 函式觸發渲染過程。這讓您可以完全控制 PDF 生成的時間,非常適合單頁應用程式或需要精確時間控制的複雜 JavaScript 驅動網站。

