如何在PDF生成中使用基本URL与C#

How to Use Base URLs & Asset Encoding

This article was translated from English: Does it need improvement?
Translated
View the article in English

IronPDF是一个在.NET项目中生成PDF文档的有用工具。

此库的一个常见用途是“HTML到PDF”渲染——使用HTML作为渲染PDF文档的设计语言。 一个合理的问题是:我们如何在HTML到PDF转换中使用CSS样式表和图像文件

如标题:2(快速入门:在IronPDF中实现基本URL)

通过轻松实现基本URL,在.NET C#中进行HTML到PDF转换期间的无缝资产加载,开始使用IronPDF。 此示例演示如何设置BaseUrlOrPath,以确保所有CSS、JavaScript和图像均正确引用,从而简化生成强大PDF文档的过程。 非常适合渴望通过最小配置增强其PDF渲染的开发人员。

Nuget IconGet started making PDFs with NuGet now:

  1. Install IronPDF with NuGet Package Manager

    PM > Install-Package IronPdf

  2. Copy and run this code snippet.

    new IronPdf.ChromePdfRenderer().RenderHtmlAsPdf("<img src='icons/logo.png'>", @"C:\site\assets\").SaveAs("with‑assets.pdf");
  3. Deploy to test on your live environment

    Start using IronPDF in your project today with a free trial
    arrow pointer
class="hsg-featured-snippet">

最小工作流(5个步骤)

  1. 下载IronPDF以支持HTML到CSS到图像
  2. 指定BaseUrlOrPath参数以使用HTML中的外部图像
  3. 在MVC中配置正确的src以显示在Web和输出PDF中
  4. 指定BaseUrl属性以使用自定义页眉和页脚
  5. 检查输出的PDF


使用图像和CSS资产从HTML字符串渲染PDF

在使用HTML字符串到PDF转换时,务必为诸如CSS、JavaScript文件和图像等资产设置BaseUrlOrPath参数。 BaseUrlOrPath指定了加载所有资产的基URL。

这可以是以'http'开头的网络URL以加载远程资产,或是访问您磁盘上资产的本地文件路径。 正确设置BaseUrlOrPath确保在转换过程中资产被正确加载。

:path=/static-assets/pdf/content-code-examples/how-to/base-urls-baseurl.cs
using IronPdf;

// Instantiate ChromePdfRenderer
ChromePdfRenderer renderer = new ChromePdfRenderer();

string baseUrl = @"C:\site\assets\";
string html = "<img src='icons/iron.png'>";

// Render HTML to PDF
PdfDocument pdf = renderer.RenderHtmlAsPdf(html, baseUrl);

// Export PDF
pdf.SaveAs("html-with-assets.pdf");
Imports IronPdf

' Instantiate ChromePdfRenderer
Private renderer As New ChromePdfRenderer()

Private baseUrl As String = "C:\site\assets\"
Private html As String = "<img src='icons/iron.png'>"

' Render HTML to PDF
Private pdf As PdfDocument = renderer.RenderHtmlAsPdf(html, baseUrl)

' Export PDF
pdf.SaveAs("html-with-assets.pdf")
$vbLabelText   $csharpLabel

MVC应用程序

在MVC应用程序中,指定图像的文件路径可能会有挑战。 为了确保图像能被IronPDF找到并在网站上正确显示,需要正确配置IronPDF的baseUrl和HTML字符串上的src=""属性。

如下文件层次结构设置

  • baseUrlOrPath设为@"wwwroot/image"
  • src属性设为"../image/Sample.jpg"
wwwroot
└── image
    ├── Sample.jpg
    └── Sample.png

例如:

:path=/static-assets/pdf/content-code-examples/how-to/base-mvc.cs
// Instantiate ChromePdfRenderer
ChromePdfRenderer renderer = new ChromePdfRenderer();

// Render HTML to PDF
PdfDocument pdf = renderer.RenderHtmlAsPdf("html.Result", @"wwwroot/image");
' Instantiate ChromePdfRenderer
Dim renderer As New ChromePdfRenderer()

' Render HTML to PDF
Dim pdf As PdfDocument = renderer.RenderHtmlAsPdf("html.Result", "wwwroot/image")
$vbLabelText   $csharpLabel
<img src="../image/Sample.jpg"/>
<img src="../image/Sample.png"/>
<img src="../image/Sample.jpg"/>
<img src="../image/Sample.png"/>
HTML

警告

无效的文件路径格式

以下格式在Chrome浏览器中查看时效果良好,但在MVC应用程序中使用时指向错误的文件夹目录。如果在RenderHtmlAsPdf方法中提供baseUrlOrPath,这些格式在IronPDF中仍然有效:

<img src="image/footer.png"/>  
<img src="./image/footer.png"/>  
<img src="image/footer.png"/>  
<img src="./image/footer.png"/>  
HTML

另一方面,这些格式在MVC应用程序中效果良好,但涉及文件路径时,这些格式在IronPDF中并不理想:

<img src="/image/footer.png"/>  
<img src="~/image/footer.png"/>
<img src="/image/footer.png"/>  
<img src="~/image/footer.png"/>
HTML

带有图像和资产的HTML页眉和页脚

当我们将HTML页眉和页脚渲染到新的或现有的PDF时,它们被视为独立的HTML文档,而不继承PDF本身的BaseURL。

我们应该设置一个可以加载资产的BaseURL:

:path=/static-assets/pdf/content-code-examples/how-to/base-header-footer.cs
using IronPdf;
using System;

// Instantiate ChromePdfRenderer
ChromePdfRenderer renderer = new ChromePdfRenderer();

// Add header
renderer.RenderingOptions.HtmlHeader = new HtmlHeaderFooter()
{
    MaxHeight = 20,
    HtmlFragment = "<img src='logo.png'>",
    BaseUrl = new Uri(@"C:\assets\images\").AbsoluteUri
};
Imports IronPdf
Imports System

' Instantiate ChromePdfRenderer
Private renderer As New ChromePdfRenderer()

' Add header
renderer.RenderingOptions.HtmlHeader = New HtmlHeaderFooter() With {
	.MaxHeight = 20,
	.HtmlFragment = "<img src='logo.png'>",
	.BaseUrl = (New Uri("C:\assets\images\")).AbsoluteUri
}
$vbLabelText   $csharpLabel

带有CSS、JS和图像资产的HTML文件到PDF

将HTML文件渲染为PDF时,所有资产都将假定本地文件。

:path=/static-assets/pdf/content-code-examples/how-to/base-html-file.cs
using IronPdf;

// Instantiate ChromePdfRenderer
ChromePdfRenderer renderer = new ChromePdfRenderer();

// Render HTML file to PDF
PdfDocument pdf = renderer.RenderHtmlFileAsPdf("C:\\Assets\\TestInvoice1.html");

// Export PDF
pdf.SaveAs("Invoice.pdf");
Imports IronPdf

' Instantiate ChromePdfRenderer
Private renderer As New ChromePdfRenderer()

' Render HTML file to PDF
Private pdf As PdfDocument = renderer.RenderHtmlFileAsPdf("C:\Assets\TestInvoice1.html")

' Export PDF
pdf.SaveAs("Invoice.pdf")
$vbLabelText   $csharpLabel

在上述示例中,所有JS、CSS和图像文件都将从磁盘上的C:\Assets文件夹加载——该HTML文件位于的相同目录。

为了方便,您可以使用ChromePdfRenderOptions中的CustomCssUrl指定额外样式表,如果您希望,仅用于.NET PDF渲染。例如:

:path=/static-assets/pdf/content-code-examples/how-to/base-html-file-baseurl.cs
using IronPdf;

// Instantiate ChromePdfRenderer
ChromePdfRenderer renderer = new ChromePdfRenderer();

// Set additional CSS url
renderer.RenderingOptions.CustomCssUrl = "./style.css";

// Render HTML file to PDF
PdfDocument pdf = renderer.RenderHtmlAsPdf("<h1>Hello World</h1>");

// Export PDF
pdf.SaveAs("tryCss.pdf");
Imports IronPdf

' Instantiate ChromePdfRenderer
Private renderer As New ChromePdfRenderer()

' Set additional CSS url
renderer.RenderingOptions.CustomCssUrl = "./style.css"

' Render HTML file to PDF
Dim pdf As PdfDocument = renderer.RenderHtmlAsPdf("<h1>Hello World</h1>")

' Export PDF
pdf.SaveAs("tryCss.pdf")
$vbLabelText   $csharpLabel

[{i:(ChromePdfRenderOptions.CustomCssUrl属性当前仅在使用RenderHtmlAsPdf方法从HTML字符串渲染到PDF文档时功能性。)}]

图像资产编码

图像资产可以直接编码到HTML文件或字符串中,这可以帮助避免图像无法找到的一些烦恼问题。 为此,我们可以利用base64的使用:

  1. 首先通过读取图像文件或通过网络请求获取图像的二进制数据。
  2. 使用Microsoft .NET中的Convert.ToBase64String方法将二进制数据转换为base64。
  3. 在HTML中构建img标签,使用"data:image/svg+xml;base64,"放在base64数据之前。 您可能已经注意到,在base64数据之前会指定图像类型。 访问MDN Web Docs图像类型和格式以获取有关图像格式类型的更多信息。
:path=/static-assets/pdf/content-code-examples/how-to/add-images-to-pdfs-base64-image.cs
using IronPdf;
using System;
using System.IO;

ChromePdfRenderer renderer = new ChromePdfRenderer();

// Import image file binary data
byte[] binaryData = File.ReadAllBytes("ironpdf-logo-text-dotnet.svg");

// Convert the binary data to base 64
string imgDataUri = Convert.ToBase64String(binaryData);

// Embed in HTML
string html = $"<img src='data:image/svg+xml;base64,{imgDataUri}'>";

// Convert HTML to PDF
PdfDocument pdf = renderer.RenderHtmlAsPdf(html);

// Export the PDF
pdf.SaveAs("embedImageBase64.pdf");
Imports IronPdf
Imports System
Imports System.IO

Private renderer As New ChromePdfRenderer()

' Import image file binary data
Private binaryData() As Byte = File.ReadAllBytes("ironpdf-logo-text-dotnet.svg")

' Convert the binary data to base 64
Private imgDataUri As String = Convert.ToBase64String(binaryData)

' Embed in HTML
Private html As String = $"<img src='data:image/svg+xml;base64,{imgDataUri}'>"

' Convert HTML to PDF
Private pdf As PdfDocument = renderer.RenderHtmlAsPdf(html)

' Export the PDF
pdf.SaveAs("embedImageBase64.pdf")
$vbLabelText   $csharpLabel

常见问题解答

使用基本URL进行HTML到PDF转换的重要性是什么?

基本URL在HTML到PDF转换中至关重要,因为它们确保所有相关资产如CSS样式表、JavaScript文件和图像都被正确加载。在IronPDF中,可以将BaseUrlOrPath参数设置为Web URL或本地文件路径以便于此过程。

如何在MVC应用程序中处理PDF生成的资产加载?

在使用IronPDF的MVC应用程序中,您可以通过配置BaseUrlOrPath参数指向包含资产的目录来处理资产加载。这样,您的HTML将正确引用相对于此基础路径的CSS和图像路径。

什么是资产编码,为什么在PDF生成中使用?

资产编码涉及将图像数据转换为base64字符串并嵌入到HTML中。这种与IronPDF一起使用的技术确保在PDF渲染过程中图像不丢失,特别是当资产不能直接从URL或文件路径访问时。

如何在.NET中包含额外的样式表以进行PDF渲染?

您可以使用IronPDF的ChromePdfRenderOptions在.NET中包含额外的样式表。通过设置CustomCssUrl属性,您可以指定渲染过程中使用的外部样式表。

在PDF中缺少图像的一些常见故障排除步骤是什么?

在PDF中缺少图像的一些常见故障排除步骤包括验证HTML中的BaseUrlOrPath和src属性的正确性。确保在使用IronPDF时这些路径是准确的将解决大多数与缺少图像相关的问题。

如何在PDF中渲染带有图像的HTML页眉和页脚?

通过为每个设置单独的BaseURL,可以在PDF中渲染带有图像的HTML页眉和页脚。使用IronPDF,页眉和页脚视为独立的HTML文档,因此重要的是确保其基本路径被正确设置以供资产加载。

您可以将带有资产的本地HTML文件转换为PDF吗?

是的,您可以使用IronPDF将带有资产的本地HTML文件转换为PDF。通过确保BaseUrlOrPath设置为HTML文件的目录,IronPDF将正确加载所有关联的资产,如CSS和图像。

使用基本 URL 加载资源时,IronPDF 是否与 .NET 10 完全兼容?

是的。IronPDF 完全兼容 .NET 10。它支持在 HTML 转 PDF 转换中使用 BaseUrlOrPath(无论是本地文件路径还是 Web URL)加载资源,无需额外的自定义变通方案。您可以像在早期版本中一样,在 .NET 10 项目中放心地使用 IronPDF 的基本 URL。

Curtis Chau
技术作家

Curtis Chau 拥有卡尔顿大学的计算机科学学士学位,专注于前端开发,精通 Node.js、TypeScript、JavaScript 和 React。他热衷于打造直观且美观的用户界面,喜欢使用现代框架并创建结构良好、视觉吸引力强的手册。

除了开发之外,Curtis 对物联网 (IoT) 有浓厚的兴趣,探索将硬件和软件集成的新方法。在空闲时间,他喜欢玩游戏和构建 Discord 机器人,将他对技术的热爱与创造力相结合。

准备开始了吗?
Nuget 下载 16,154,058 | 版本: 2025.11 刚刚发布