如何在 C# 中将 BarCode 导出为 HTML?
IronBarcode 使 C# 开发人员能够以三种格式将生成的条形码导出为 HTML:用于内嵌的数据 URL、用于直接注入的 HTML 标签或用于独立使用的完整 HTML 文件--提供了无需外部依赖的多功能集成选项。
快速入门:用一行导出条形码为 HTML 标签
生成条形码,并使用一行流畅的代码将其直接导出为格式完整的 HTML 图像标签。 快速上手,无需管理外部图像文件或资产依赖性。
最小工作流程(5 个步骤)
- 下载用于导出条形码的 C# 库。
- 将条形码导出为数据URL
- 将条形码导出为HTML标签
- 将条形码导出为HTML文件
如何将 BarCode 导出为数据 URL?
在将条形码导出为数据 URL 之前,请先了解什么是数据 URL。 Data URL(也称为 Data URI)是一种统一资源标识符,可直接在 URL 字符串中嵌入数据。 这样就可以在网页中像外部资源一样内嵌显示这些数据。 数据 URL 支持任何格式:文本、图像、音频、视频和二进制数据。 在HTML内的图像标签中使用获得的数据URL作为src属性。 如下是将GeneratedBarcode转换为数据URL的方法:
:path=/static-assets/barcode/content-code-examples/how-to/ExportBarcodeAsDataUrl.cs
using IronBarCode;
using System;
GeneratedBarcode myBarcode = BarcodeWriter.CreateBarcode("https://ironsoftware.com/csharp/barcode/", BarcodeEncoding.QRCode);
var dataUrl = myBarcode.ToDataUrl();
Console.WriteLine(dataUrl);
Imports IronBarCode
Imports System
Private myBarcode As GeneratedBarcode = BarcodeWriter.CreateBarcode("https://ironsoftware.com/csharp/barcode/", BarcodeEncoding.QRCode)
Private dataUrl = myBarcode.ToDataUrl()
Console.WriteLine(dataUrl)
使用BarcodeWriter类创建条形码,传递条形码值和编码作为参数。 通过附加GeneratedBarcode获取数据URL。 此方法适用于 IronBarcode 中所有支持的条码格式。
为什么使用数据 URL 对 Web 应用程序很重要?
数据 URL 通过减少 HTTP 请求和提高页面加载性能为网络应用程序提供了显著优势。 当您将 BarCode 作为数据 URL 嵌入时,图像数据就会成为 HTML 文档本身的一部分,从而消除了单独的图像文件请求。 这样做的好处是
- 单页应用程序(SPA)要求尽量减少服务器往返次数
- 电子邮件模板,外部图片可能会被阻止
- 可离线运行的应用程序无需网络连接即可运行
- 动态条形码生成,其中创建物理文件效率低下
什么情况下应使用数据 URL 而不是图像文件?
当条形码较小(32KB 以下)且需要立即进行内联渲染时,请使用数据 URL。 在以下情况下,选择存储在服务器或 CDN 上的传统图像文件:
:path=/static-assets/barcode/content-code-examples/how-to/create-barcode-as-html-3.cs
// Example: Choosing between Data URL and file export based on size
GeneratedBarcode barcode = BarcodeWriter.CreateBarcode("LARGE-DATA-STRING-HERE", BarcodeEncoding.PDF417);
// Check estimated size before choosing export method
if (barcode.BinaryStream.Length < 32768) // 32KB threshold
{
// Use Data URL for smaller barcodes
string dataUrl = barcode.ToDataUrl();
// Embed directly in HTML
}
else
{
// Save as file for larger barcodes
barcode.SaveAsImage("large-barcode.png");
// Reference as external resource
}
' Example: Choosing between Data URL and file export based on size
Dim barcode As GeneratedBarcode = BarcodeWriter.CreateBarcode("LARGE-DATA-STRING-HERE", BarcodeEncoding.PDF417)
' Check estimated size before choosing export method
If barcode.BinaryStream.Length < 32768 Then ' 32KB threshold
' Use Data URL for smaller barcodes
Dim dataUrl As String = barcode.ToDataUrl()
' Embed directly in HTML
Else
' Save as file for larger barcodes
barcode.SaveAsImage("large-barcode.png")
' Reference as external resource
End If
数据 URL 的大小限制是什么?
虽然现代浏览器在技术上支持几兆字节的数据 URL,但在实际操作中仍存在限制:
- Internet Explorer 8:限制为 32KB
- 现代浏览器:支持 2-4MB,但性能下降
- 移动浏览器:内存限制带来更严格的限制
- 电子邮件客户端:将数据 URL 限制为 8-64KB
将数据 URL BarCode 保持在 32KB 以下,以获得最佳性能。 对于较大的条形码或多个条形码的生成,请使用我们的 export as stream 功能进行高效的内存管理。
如何将条形码导出为 HTML 标记?
使用GeneratedBarcode导出为HTML。 这个方法将GeneratedBarcode对象呈现为一个完整的HTML标签,可以直接注入到HTML中无需JavaScript、CSS或图像依赖。 以下代码演示了 HTML 标记导出:
:path=/static-assets/barcode/content-code-examples/how-to/ExportBarcodeAsHtmlTag.cs
using IronBarCode;
using System;
GeneratedBarcode myBarcode = BarcodeWriter.CreateBarcode("https://ironsoftware.com/csharp/barcode/", BarcodeEncoding.QRCode);
var htmlTag = myBarcode.ToHtmlTag();
Console.WriteLine(htmlTag);
Imports IronBarCode
Imports System
Private myBarcode As GeneratedBarcode = BarcodeWriter.CreateBarcode("https://ironsoftware.com/csharp/barcode/", BarcodeEncoding.QRCode)
Private htmlTag = myBarcode.ToHtmlTag()
Console.WriteLine(htmlTag)
附加GeneratedBarcode以获取生成的条形码的HTML标签。 将此 HTML 标签直接嵌入到较大的 HTML 文件中。有关高级样式选项,请参阅我们的自定义 BarCode 样式指南。
为什么 HTML 标签导出比外部图片引用更好?
与外部图片引用相比,HTML 标签导出具有关键优势:
1.无破损图片链接:条形码数据直接嵌入标签中 2.更快的呈现:无需额外的 HTTP 请求 3.简化部署:无需单独的图像资产管理 4.更好的安全性:不暴露文件路径或服务器结构 5.动态生成:非常适合实时创建 BarCode
下面是一个实用的网络应用集成示例:
:path=/static-assets/barcode/content-code-examples/how-to/create-barcode-as-html-5.cs
// Generate multiple barcodes for a product catalog
var products = new[] { "PROD-001", "PROD-002", "PROD-003" };
var htmlBuilder = new StringBuilder();
foreach (var productCode in products)
{
var barcode = BarcodeWriter.CreateBarcode(productCode, BarcodeEncoding.Code128)
.ResizeTo(200, 50)
.SetMargins(10);
htmlBuilder.AppendLine($"<div class='product-barcode'>");
htmlBuilder.AppendLine($" <p>Product: {productCode}</p>");
htmlBuilder.AppendLine($" {barcode.ToHtmlTag()}");
htmlBuilder.AppendLine($"</div>");
}
Imports System.Text
' Generate multiple barcodes for a product catalog
Dim products = New String() {"PROD-001", "PROD-002", "PROD-003"}
Dim htmlBuilder = New StringBuilder()
For Each productCode In products
Dim barcode = BarcodeWriter.CreateBarcode(productCode, BarcodeEncoding.Code128) _
.ResizeTo(200, 50) _
.SetMargins(10)
htmlBuilder.AppendLine("<div class='product-barcode'>")
htmlBuilder.AppendLine($" <p>Product: {productCode}</p>")
htmlBuilder.AppendLine($" {barcode.ToHtmlTag()}")
htmlBuilder.AppendLine("</div>")
Next
如何自定义生成的 HTML 标记属性?
当ToHtmlTag()生成标准的img标签时,您可以用额外的属性或自定义HTML包装来增强它。 如需高级定制,请将 IronBarcode 与我们的风格化功能相结合:
:path=/static-assets/barcode/content-code-examples/how-to/create-barcode-as-html-6.cs
// Create a customized barcode with specific styling
var customBarcode = BarcodeWriter.CreateBarcode("CUSTOM-123", BarcodeEncoding.Code128)
.AddAnnotationTextAboveBarcode("Product ID")
.SetMargins(15)
.ChangeBackgroundColor(System.Drawing.Color.LightGray);
// Get the HTML tag and add custom attributes
string htmlTag = customBarcode.ToHtmlTag();
string customizedTag = htmlTag.Replace("<img", "<img class='barcode' id='product-123'");
Imports System.Drawing
' Create a customized barcode with specific styling
Dim customBarcode = BarcodeWriter.CreateBarcode("CUSTOM-123", BarcodeEncoding.Code128) _
.AddAnnotationTextAboveBarcode("Product ID") _
.SetMargins(15) _
.ChangeBackgroundColor(Color.LightGray)
' Get the HTML tag and add custom attributes
Dim htmlTag As String = customBarcode.ToHtmlTag()
Dim customizedTag As String = htmlTag.Replace("<img", "<img class='barcode' id='product-123'")
什么情况下应选择 HTML 标签而不是数据 URL 格式?
需要时选择 HTML 标签格式:
- 干净、可读的 HTML 输出
- 与现有 HTML 模板轻松集成
- 与 HTML 编辑器和 CMS 系统兼容
- 为内容创作者提供直接复制粘贴功能
HTML 标签格式在 Blazor 应用程序中效果尤佳,您可以将条形码图像动态注入到组件中。
如何将 BarCode 保存为 HTML 文件?
使用GeneratedBarcode保存为HTML文件。 下面的代码演示了这种方法:
:path=/static-assets/barcode/content-code-examples/how-to/ExportBarcodeAsHtmlFile.cs
using IronBarCode;
GeneratedBarcode myBarcode = BarcodeWriter.CreateBarcode("https://ironsoftware.com/csharp/barcode/", BarcodeEncoding.QRCode);
myBarcode.SaveAsHtmlFile("myBarcode.html");
Imports IronBarCode
Private myBarcode As GeneratedBarcode = BarcodeWriter.CreateBarcode("https://ironsoftware.com/csharp/barcode/", BarcodeEncoding.QRCode)
myBarcode.SaveAsHtmlFile("myBarcode.html")
此方法接受一个文件路径字符串。 生成的HTML文件在适当的<body>标签中包含了条形码作为HTML标签,形成一个完整的HTML文件。对于多种文件格式的复杂场景,请参阅我们的数据输出格式指南。
为什么要生成完整的 HTML 文件而不是片段?
完整的 HTML 文件在特定使用情况下具有明显的优势:
- Standalone 文档:生成可打印的 BarCode 表单
- 电子邮件附件:发送独立的条形码文件
- 存档目的:以适当的结构存储条形码
- 测试和调试:独立查看 BarCode
- 批量处理:生成多个文件以供分发
以下是生成一批 HTML 文件的示例:
// Generate HTML files for inventory items
public void GenerateInventoryBarcodes(List<InventoryItem> items)
{
foreach (var item in items)
{
var barcode = BarcodeWriter.CreateBarcode(item.SKU, BarcodeEncoding.Code128)
.AddAnnotationTextBelowBarcode($"{item.Name} - ${item.Price:F2}")
.ResizeTo(300, 100);
// Save with descriptive filename
string filename = $"barcode_{item.SKU}_{DateTime.Now:yyyyMMdd}.html";
barcode.SaveAsHtmlFile(filename);
}
}
// Generate HTML files for inventory items
public void GenerateInventoryBarcodes(List<InventoryItem> items)
{
foreach (var item in items)
{
var barcode = BarcodeWriter.CreateBarcode(item.SKU, BarcodeEncoding.Code128)
.AddAnnotationTextBelowBarcode($"{item.Name} - ${item.Price:F2}")
.ResizeTo(300, 100);
// Save with descriptive filename
string filename = $"barcode_{item.SKU}_{DateTime.Now:yyyyMMdd}.html";
barcode.SaveAsHtmlFile(filename);
}
}
' Generate HTML files for inventory items
Public Sub GenerateInventoryBarcodes(items As List(Of InventoryItem))
For Each item In items
Dim barcode = BarcodeWriter.CreateBarcode(item.SKU, BarcodeEncoding.Code128) _
.AddAnnotationTextBelowBarcode($"{item.Name} - ${item.Price:F2}") _
.ResizeTo(300, 100)
' Save with descriptive filename
Dim filename As String = $"barcode_{item.SKU}_{DateTime.Now:yyyyMMdd}.html"
barcode.SaveAsHtmlFile(filename)
Next
End Sub
HTML 文件导出的常见用例有哪些?
事实证明,HTML 文件导出在这些情况下非常有价值:
1.零售销售点系统:生成可打印的价格标签 2.仓库管理:为货架创建条形码标签 3.文档管理:在报告中嵌入 BarCode 4.质量控制:生成可跟踪的批次代码 5.事件管理:使用可扫描代码创建票据
对于大批量条形码生成,实施 async 和多线程 以提高性能。 在使用 QR 代码等专业格式时,我们的 C# QR 代码生成器教程可为创建和定制 QR 代码提供全面指导,以满足各种业务需求。
常见问题解答
如何在 C# 中将条形码导出为数据 URL?
using IronBarcode,您可以通过使用 GeneratedBarcode 对象上的 ToDataUrl() 方法将条形码导出为数据 URL。只需使用BarcodeWriter.CreateBarcode()创建您所需值和编码的条形码,然后调用ToDataUrl()获取可直接嵌入HTML的数据URL字符串。
BarCode 有哪三种 HTML 导出格式?
IronBarcode 提供三种 HTML 导出格式:数据 URL 用于内嵌,无需外部文件;HTML 标签用于直接注入网页;完整的 HTML 文件用于独立使用。每种格式都能满足网络应用程序中不同的集成需求。
我可以用一行代码生成条形码的 HTML 图像标签吗?
是的,IronBarcode 允许您用一行流畅的代码生成一个完整的 HTML 图像标签。使用 BarcodeWriter.CreateBarcode() 生成您的条码值和编码,然后链入 ToHtmlTag() 方法以获得一个完整的 HTML 图像标签,以便插入。
何时应使用数据 URL 而不是传统的图像文件来制作 BarCode?
当条形码较小(32KB 以下)且需要立即进行内联渲染时,请使用数据 URL。它们是单页应用程序、电子邮件模板、离线应用程序和动态条码生成方案的理想选择。IronBarcode的ToDataUrl()方法可实现无缝转换。
HTML 导出支持哪些条形码格式?
IronBarcode 支持其所有用于 HTML 导出的条形码格式,包括 Code 128、QR 码等。ToDataUrl(), ToHtmlTag() 和 HTML 文件导出方法适用于库中所有受支持的条码格式。
使用数据 URL 如何提高网络应用程序的性能?
数据 URL 通过直接在 HTML 文档中嵌入条形码图像数据,消除了对图像文件的单独 HTTP 请求,从而提高了性能。这减少了服务器往返次数,提高了页面加载时间,这在网络应用程序中使用 IronBarcode 进行动态条码生成时尤为有利。
IronBarcode是否提供支持自定义条形码外观的功能?
是的,IronBarcode为条形码外观提供广泛的自定义选项,包括颜色、大小和文本注释,允许运您将条形码设计成符合您特定的设计要求。
IronBarcode如何帮助提高业务流程的效率?
IronBarcode通过快速准确的条码生成和读取提高了业务流程效率,减少了手动数据输入错误,并改善了库存和资产跟踪。
在项目中实现IronBarcode需要哪些编程技能?
了解C#编程的基础知识就足以在项目中实现IronBarcode,因为它提供了简单的方法和全面的文档来指导开发人员。
IronBarcode适合小项目和大型企业应用吗?
IronBarcode被设计为可扩展且多功能,适合需要强大条码解决方案的小项目和大型企业应用。

