IronBarcode 操作指南 .NET 將條碼創建為 HTML 如何在 C# 中將 BarCode 匯出為 HTML; Hairil Hasyimi Bin Omar 更新:2026年1月10日 下載 IronBarcode NuGet 下載 DLL 下載 開始免費試用 法學碩士副本 法學碩士副本 將頁面複製為 Markdown 格式,用於 LLMs 在 ChatGPT 中打開 請向 ChatGPT 諮詢此頁面 在雙子座打開 請向 Gemini 詢問此頁面 在 Grok 中打開 向 Grok 詢問此頁面 打開困惑 向 Perplexity 詢問有關此頁面的信息 分享 在 Facebook 上分享 分享到 X(Twitter) 在 LinkedIn 上分享 複製連結 電子郵件文章 This article was translated from English: Does it need improvement? Translated View the article in English IronBarcode 使 C# 開發人員能夠以三種格式將生成的條碼輸出為 HTML:資料 URL 用於內嵌,HTML 標籤用於直接注入,或完整的 HTML 檔案用於獨立使用-提供多功能的整合選項,無需外部依賴。 快速入門:用一行程式碼將條碼匯出為 HTML 標籤 使用一行流暢的程式碼,產生條碼並將其直接匯出為完整格式的 HTML 影像標籤。 快速上手,無需管理外部影像檔案或資產依賴性。 立即開始使用 NuGet 建立 PDF 檔案: 使用 NuGet 套件管理器安裝 IronBarcode PM > Install-Package BarCode 複製並運行這段程式碼。 var htmlTag = BarcodeWriter.CreateBarcode("1234567890", BarcodeWriterEncoding.Code128).ToHtmlTag(); 部署到您的生產環境進行測試 立即開始在您的專案中使用 IronBarcode,免費試用! 免費試用30天 ### 最小工作流程(5 個步驟) 下載用於匯出條碼的 C# 程式庫。 將條碼導出為數據 URL 將條形碼導出為 HTML 標籤 將條碼導出為 HTML 文件 如何將 BarCode 匯出為資料 URL? 在將條碼匯出為資料 URL 之前,請先瞭解何謂資料 URL。 Data URL(也稱為 Data URI)是直接在 URL 字串中嵌入資料的統一資源識別碼。 這允許在網頁中內嵌顯示,就像資料是外部資源一樣。 資料 URL 支援任何格式:文字、影像、音訊、視訊和二進位資料。 在 HTML 中的圖片標籤內使用取得的資料 URL 作為 src 屬性。 以下是如何將 GeneratedBarcode 轉換為 Data 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) $vbLabelText $csharpLabel 使用 BarcodeWriter 類中的 CreateBarcode() 方法創建條碼,並將條碼值和編碼作為參數。 透過將 ToDataUrl() 方法附加到 GeneratedBarcode 來取得 Data URL。 此方法適用於 IronBarcode 中所有支援的條碼格式。 Why Does Using Data URL Matter for Web Applications? 資料 URL 可減少 HTTP 請求並提昇頁面載入效能,為網路應用程式提供顯著的優勢。 當您將 BarCode 嵌入為資料 URL 時,影像資料會成為 HTML 文件本身的一部分,省去了單獨的影像檔案請求。 這樣做的好處 單頁應用程式 (SPA) 需要最少的伺服器往返次數 電子郵件範本,外部圖片可能會被阻擋 離線應用程式在沒有網路連線的情況下運作 動態條碼產生,其中建立實體檔案的效率很低 關於生產部署,請參閱我們的 部署到 Azure 或 AWS 部署指南,以瞭解基於雲的 BarCode 生成。 何時應該使用資料 URL 而非圖片檔案? 當條碼較小(32KB 以下)且需要立即內嵌渲染時,請使用資料 URL。 選擇儲存於伺服器或 CDN 的傳統影像檔案時: // 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 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 $vbLabelText $csharpLabel 資料 URL 的大小限制為何? 儘管現代瀏覽器在技術上支援數 MB 的資料 URL,但仍存在實際限制: Internet Explorer 8:限制為 32KB 現代瀏覽器:支援 2-4MB,但效能會降低 行動瀏覽器:由於記憶體的限制,限制更為嚴格 電子郵件用戶端:限制資料 URL 為 8-64KB 將資料 URL BarCode 保持在 32KB 以下,以獲得最佳效能。 對於較大的 BarCode 或多個條碼的產生,請使用我們的 export as stream 功能來進行有效的記憶體管理。 如何將 BarCode 匯出為 HTML 標籤? 使用 ToHtmlTag() 方法將 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) $vbLabelText $csharpLabel 將 ToHtmlTag() 方法附加到 GeneratedBarcode 以取得產生條碼的 HTML 標籤。 將此 HTML 標籤直接嵌入到較大的 HTML 檔案中。如需進階樣式選項,請參閱我們的 自訂 BarCode 樣式指南。 為什麼 HTML 標籤匯出比外部圖片參考更好? HTML 標籤匯出提供了比外部圖片參考更重要的優勢: 1.沒有破損的圖片連結:條碼資料直接嵌入在標籤中 2.更快的呈現:不需要額外的 HTTP 請求 3.簡化部署:無需獨立的映像資產管理 4.更好的安全性:不會暴露檔案路徑或伺服器結構 5.動態產生:實時條碼建立的完美選擇 以下是一個實用的網路應用程式整合範例: // 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>"); } // 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 $vbLabelText $csharpLabel 如何自訂產生的 HTML 標籤屬性? 當 ToHtmlTag() 產生一個標準的 img 標籤時,您可以使用額外的屬性或自訂的 HTML 包裝來強化它。 如需進階客製化功能,請結合 IronBarcode 與我們的 造型功能: // 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'"); // 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'"); ' Create a customized barcode with specific styling Dim 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 Dim htmlTag As String = customBarcode.ToHtmlTag() Dim customizedTag As String = htmlTag.Replace("<img", "<img class='barcode' id='product-123'") $vbLabelText $csharpLabel 何時應該選擇 HTML 標籤而非資料 URL 格式? 需要時選擇 HTML 標籤格式: 乾淨、可讀的 HTML 輸出 容易與現有的 HTML 模板整合 與 HTML 編輯器和 CMS 系統相容 為內容創造者提供直接複製貼上功能 HTML 標籤格式特別適用於 Blazor 應用程式,您可將條碼影像動態注入元件中。 如何將 BarCode 儲存為 HTML 檔案? 使用 SaveAsHtmlFile() 方法將 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") $vbLabelText $csharpLabel 此方法接受檔案路徑字串。 生成的 HTML 檔案包含條碼作為 HTML 標籤,在適當的 <html>、<head> 和 <body> 標籤中,形成一個完整的 HTML 檔案。對於具有多種檔案格式的複雜情況,請參閱我們的 輸出資料格式指南。 為何要生成完整的 HTML 檔案而不是片段? 完整的 HTML 檔案在特定使用情況下具有明顯的優勢: Standalone 文件:產生可列印的 BarCode 表單 電子郵件附件:傳送自成一格的 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 $vbLabelText $csharpLabel HTML 檔案匯出的常見使用案例有哪些? HTML 檔案匯出在這些情況下很有價值: 1.零售點銷售系統:產生可列印的價格標籤 2.倉庫管理:為貨架建立 BarCode 標籤 3.文件管理:在報表中嵌入 BarCode 4.品質控制:產生可追蹤的批次代碼 5.事件管理:使用可掃描代碼建立票單 對於大量的 BarCode 生成,實施 async 和多執行緒 以提高性能。 在使用 QR 碼等專門格式時,我們的 C# QR 碼產生器教學 提供了全面的指導,可針對各種業務需求建立和自訂 QR 碼。 常見問題解答 如何在 C# 中將 BarCode 匯出為資料 URL? 使用 IronBarcode,您可以在 GeneratedBarcode 物件上使用 ToDataUrl() 方法將條碼匯出為 Data URL。只需使用BarcodeWriter.CreateBarcode()使用您所需的值和编码创建您的条形码,然后调用ToDataUrl()来获取数据URL字符串,该字符串可以直接嵌入到HTML中。 BarCode 有哪三種 HTML 匯出格式? IronBarcode 提供三種 HTML 匯出格式:無需外部檔案即可內嵌的資料 URL、直接注入網頁的 HTML 標籤,以及獨立使用的完整 HTML 檔案。每種格式都能滿足網頁應用程式中不同的整合需求。 我可以用一行代碼為 BarCode 產生 HTML 圖片標籤嗎? 是的,IronBarcode 允許您用一行流暢的程式碼來產生一個完整的 HTML 圖像標籤。使用 BarcodeWriter.CreateBarcode() 加上您的條碼值和編碼,然後鏈結 ToHtmlTag() 方法來獲得一個完整的 HTML 圖像標籤,準備插入。 何時應該使用資料 URL 而非傳統的圖像檔案來處理 BarCode? 當條碼較小(32KB 以下)且需要立即內嵌渲染時,請使用資料 URL。它們是單頁應用程序,電子郵件模板,離線應用程序和動態條碼生成方案的理想選擇。IronBarcode的ToDataUrl()方法使得这种转换天衣无缝。 HTML 匯出支援哪些 BarCode 格式? IronBarcode 支援其所有條碼格式的 HTML 匯出,包括 Code 128、QR Code 以及許多其他格式。ToDataUrl()、ToHtmlTag()和HTML文件導出方法可與庫中所有支援的條碼格式一起使用。 使用資料 URL 如何改善網路應用程式效能? 資料 URL 透過直接在 HTML 文件中嵌入 BarCode 影像資料來改善效能,省去了影像檔案的單獨 HTTP 請求。這減少了伺服器的往返次數,並改善了頁面載入時間,這對於在 Web 應用程式中使用 IronBarcode 進行動態條碼生成尤其有利。 Hairil Hasyimi Bin Omar 立即與工程團隊聊天 軟體工程師 就像所有優秀的工程師一樣,Hairil 也是一位狂熱的學習者。他不斷精進 C#、Python 和 Java 的知識,利用這些知識為整個 Iron Software 的團隊成員增加價值。Hairil 從馬來西亞的 Universiti Teknologi MARA 大學加入 Iron Software 團隊,畢業於該校的化學與流程工程學系,並取得學士學位。 準備好開始了嗎? Nuget 下載 2,070,733 | 版本: 2026.2 剛剛發布 免費 NuGet 下載 總下載量:2,070,733 查看許可證