如何在ASP.NET MVC中動態生成和顯示條碼

ASP.NET MVC 是一個流行的網頁開發框架，允許開發人員構建健壯和動態的網頁應用程式。在網頁應用程式中，一個常見的需求是生成和顯示條碼圖片。條碼圖片用於以機器可讀的格式表示數據，並且可以被條碼掃描器讀取。

在 ASP.NET MVC 中動態生成和顯示條碼圖片可以通過市場領先的 C# 庫 IronBarcode 來實現。這個庫提供了 API，使開發人員能夠在不同平台上輕鬆生成各種格式的條碼圖片，例如 Code 39、Code 128 和 QR Code。這樣就不需要依賴 System.Drawing.Common 和 .NET Graphics API。 Windows特定 從 .NET 6 開始，IronBarcode 允許跨平台功能，並允許更多的源代碼兼容性。

IronBarcode

IronBarcode 是一個流行的 .NET 條碼庫，提供廣泛的功能，用於在 .NET 應用程式中創建、讀取和操作條碼圖像。該庫由專門從事 .NET 組件和庫的軟體開發公司 Iron Software 開發和維護。IronBarcode 支援多種條碼格式，包括 Code 128、Code 39、QR Code、Data Matrix 和 PDF417。該庫還提供生成具有自訂尺寸、顏色和字體的條碼，以及向條碼圖像添加文字和標誌的功能。

除了條碼生成功能，IronBarcode 還包括讀取和解碼條碼圖像的功能。該庫可以從圖像、PDF 文件和實時相機畫面中讀取和解碼條碼。它支持 1D 和 2D 條碼格式，甚至可以識別部分遮擋或損壞的條碼。

先決條件

在 .NET 應用程序中使用 IronBarcode 之前，需要滿足一些先決條件。

1. .NET Framework 或 .NET Core： IronBarcode 設計為同時支持 .NET Framework 和 .NET Core。請確保您的開發環境已安裝相應的 .NET 版本。

2. Visual Studio： IronBarcode 可以與 Visual Studio 集成，以便於開發和測試。您可以使用 Visual Studio 社區版、專業版或企業版。可以從以下網站下載 Visual Studio 網站.

3. IronBarcode 函式庫： 從 Iron Software 網站 或者透過NuGet套件管理器。可以使用NuGet套件管理器主控台來執行下列指令安裝該程式庫：Install-Package BarCode。

IronBarcode 是免費供開發使用，但必須 授權 用於商業和部署目的。您可以嘗試 免費試用 測試其所有功能。

建立一個新的 ASP.NET MVC 專案

打開 Visual Studio，然後點擊「建立新專案」。

在新視窗中尋找並選擇 "ASP.NET MVC" (網頁應用程式) "模型视图控制器" 然后点击下一步按钮。

點擊撰寫新專案的名稱及其位置，然後點擊下一步。

選擇您要使用的 .NET 版本，並保持其他選項不變，然後點擊建立。

建立了一個 .NET 專案。

安裝 IronBarcode

1. 使用 NuGet 套件管理員

此選項可在 Visual Studio 中使用，並將直接將 IronBarcode 套件安裝到您的解決方案中。前往工具並點擊 NuGet 套件管理員，如圖所示。

在 NuGet 套件管理器中使用搜索框搜索 IronBarcode 庫。從可用套件列表中選擇 IronBarcode 選項。

2. 使用 Visual Studio 命令列

在 Visual Studio 選單中，依序點擊 工具 > NuGet 封裝管理員 > 封裝管理員主控台。

在套件管理器主控台標籤中輸入以下行：Install-Package BarCode。

該套件將下載/安裝到當前項目並準備使用。

使用 IronBarcode 生成和顯示條碼圖像

現在我們的環境已經設置好，我們可以開始了解如何在 ASP.NET MVC 中動態生成條碼圖像。

首先，在模型文件夾下創建一個名為 GenerateBarcodeModel.cs 的類。

    using System.ComponentModel.DataAnnotations;

    namespace GenerateBarcodeMVCCore6_Demo.Models
    {
        public class GenerateBarcodeModel
        {
            [Display(Name = "Enter Barcode Text")]
            public string Barcode
            {
                get;
                set;
            }
        }
    }

    using System.ComponentModel.DataAnnotations;

    namespace GenerateBarcodeMVCCore6_Demo.Models
    {
        public class GenerateBarcodeModel
        {
            [Display(Name = "Enter Barcode Text")]
            public string Barcode
            {
                get;
                set;
            }
        }
    }

Imports System.ComponentModel.DataAnnotations

	Namespace GenerateBarcodeMVCCore6_Demo.Models
		Public Class GenerateBarcodeModel
			<Display(Name := "Enter Barcode Text")>
			Public Property Barcode() As String
		End Class
	End Namespace

在 wwwroot 文件夾下建立一個名為 "GeneratedBarcode" 的文件夾來存儲生成的條碼圖像。

將以下操作方法新增到「controllers」資料夾中的「HomeController.cs」類別中。

    public IActionResult CreateBarcode()
            {
                return View();
            }

            //  handling POST operation Inside this Action method
            [HttpPost]
            public IActionResult CreateBarcode(GenerateBarcodeModel generateBarcode)
            {
                try
                {
                    GeneratedBarcode barcode = BarcodeWriter.CreateBarcode(generateBarcode.Barcode, BarcodeWriterEncoding.Code128);

            // Adding annotation text to barcode
                    barcode.AddBarcodeValueTextBelowBarcode();

                    // Styling the Barcode
            barcode.ResizeTo(400, 120);
                    barcode.ChangeBarCodeColor(Color.Red);
                    barcode.SetMargins(10);

                    string path = Path.Combine(_environment.WebRootPath, "GeneratedBarcode");
                    if (!Directory.Exists(path))
                    {
                        Directory.CreateDirectory(path);
                    }
                    string filePath = Path.Combine(_environment.WebRootPath, "GeneratedBarcode/barcode.png");

            // The generated barcode object can be manipulated, annotated, and exported as an image file, a bitmap image, a PDF file, or a data stream.
            // Here, we save the generated barcode as an image to the GeneratedBarcode folder we had created
                    barcode.SaveAsPng(filePath);
                    string fileName = Path.GetFileName(filePath);
                    string imageUrl = $"{this.Request.Scheme}://{this.Request.Host}{this.Request.PathBase}" + "/GeneratedBarcode/" + fileName;
                    ViewBag.QrCodeUri = imageUrl;
                }
                catch (Exception)
                {
                    throw;
                }
                return View();
            }

    public IActionResult CreateBarcode()
            {
                return View();
            }

            //  handling POST operation Inside this Action method
            [HttpPost]
            public IActionResult CreateBarcode(GenerateBarcodeModel generateBarcode)
            {
                try
                {
                    GeneratedBarcode barcode = BarcodeWriter.CreateBarcode(generateBarcode.Barcode, BarcodeWriterEncoding.Code128);

            // Adding annotation text to barcode
                    barcode.AddBarcodeValueTextBelowBarcode();

                    // Styling the Barcode
            barcode.ResizeTo(400, 120);
                    barcode.ChangeBarCodeColor(Color.Red);
                    barcode.SetMargins(10);

                    string path = Path.Combine(_environment.WebRootPath, "GeneratedBarcode");
                    if (!Directory.Exists(path))
                    {
                        Directory.CreateDirectory(path);
                    }
                    string filePath = Path.Combine(_environment.WebRootPath, "GeneratedBarcode/barcode.png");

            // The generated barcode object can be manipulated, annotated, and exported as an image file, a bitmap image, a PDF file, or a data stream.
            // Here, we save the generated barcode as an image to the GeneratedBarcode folder we had created
                    barcode.SaveAsPng(filePath);
                    string fileName = Path.GetFileName(filePath);
                    string imageUrl = $"{this.Request.Scheme}://{this.Request.Host}{this.Request.PathBase}" + "/GeneratedBarcode/" + fileName;
                    ViewBag.QrCodeUri = imageUrl;
                }
                catch (Exception)
                {
                    throw;
                }
                return View();
            }

Public Function CreateBarcode() As IActionResult
				Return View()
End Function

			'  handling POST operation Inside this Action method
			<HttpPost>
			Public Function CreateBarcode(ByVal generateBarcode As GenerateBarcodeModel) As IActionResult
				Try
					Dim barcode As GeneratedBarcode = BarcodeWriter.CreateBarcode(generateBarcode.Barcode, BarcodeWriterEncoding.Code128)

			' Adding annotation text to barcode
					barcode.AddBarcodeValueTextBelowBarcode()

					' Styling the Barcode
			barcode.ResizeTo(400, 120)
					barcode.ChangeBarCodeColor(Color.Red)
					barcode.SetMargins(10)

					Dim path As String = System.IO.Path.Combine(_environment.WebRootPath, "GeneratedBarcode")
					If Not Directory.Exists(path) Then
						Directory.CreateDirectory(path)
					End If
					Dim filePath As String = System.IO.Path.Combine(_environment.WebRootPath, "GeneratedBarcode/barcode.png")

			' The generated barcode object can be manipulated, annotated, and exported as an image file, a bitmap image, a PDF file, or a data stream.
			' Here, we save the generated barcode as an image to the GeneratedBarcode folder we had created
					barcode.SaveAsPng(filePath)
					Dim fileName As String = System.IO.Path.GetFileName(filePath)
					Dim imageUrl As String = $"{Me.Request.Scheme}://{Me.Request.Host}{Me.Request.PathBase}" & "/GeneratedBarcode/" & fileName
					ViewBag.QrCodeUri = imageUrl
				Catch e1 As Exception
					Throw
				End Try
				Return View()
			End Function

上述程式碼中的動作方法將處理稍後我們將建立的視圖產生的提交請求。使用IronBarcode，您可以自訂條碼格式、圖像元素、條碼字型和HTML圖像元素。如需更多自訂，可能需要額外的程式庫，例如 鐵畫 用于安裝條碼字型。更詳細的 API 文件可以在 這裡現在我們可以為條碼生成器方法創建一個視圖。

在 "HomeController.cs" 文件中，右鍵單擊 createBarcode 方法並點擊添加視圖。

選擇 Razor 視圖並點擊新增。

選擇如下圖所示的參數，然後點擊“添加”，它將自動為該方法添加視圖。

您可以修改生成的代码以根据您的需求更改介面。

    @model GenerateBarcodeMVCCore6_Demo.Models.GenerateBarcodeModel

    @{
        ViewData ["Title"] = "CreateBarcode";
    }

    CreateBarcode

    GenerateBarcodeModel

        Back to List

    @section Scripts {
        @{await Html.RenderPartialAsync("_ValidationScriptsPartial");}
    }

    @model GenerateBarcodeMVCCore6_Demo.Models.GenerateBarcodeModel

    @{
        ViewData ["Title"] = "CreateBarcode";
    }

    CreateBarcode

    GenerateBarcodeModel

        Back to List

    @section Scripts {
        @{await Html.RenderPartialAsync("_ValidationScriptsPartial");}
    }

model ReadOnly Property () As GenerateBarcodeMVCCore6_Demo.Models.GenerateBarcodeModel
		ViewData ("Title") = "CreateBarcode"
End Property

	CreateBarcode GenerateBarcodeModel Back [to] List ReadOnly Property Scripts() As section
		@
		If True Then
			Await Html.RenderPartialAsync("_ValidationScriptsPartial")
		End If
	End Property

現在一切都設定好了，只需打開 _Layout.cshtml 文件，並在 navbar 中添加 CreateBarcode 選項的程式碼。

CreateBarcode

CreateBarcode

'INSTANT VB TODO TASK: The following line uses invalid syntax:
'CreateBarcode

現在運行應用程式，在文本字段中寫入文字，然後點擊生成條碼按鈕，它將動態生成並顯示條碼圖像。

5.1. 輸出

6. 結論

在ASP.NET MVC應用程式中動態生成和顯示條碼圖像可以通過使用IronBarcode庫來實現。IronBarcode是一個功能強大的.NET條碼庫，提供了廣泛的功能，用於在.NET應用程式中創建、讀取和操作條碼圖像。通過滿足諸如安裝.NET框架、Visual Studio和IronBarcode庫等前提條件，開發人員可以輕鬆地創建ASP.NET MVC專案，並以多種格式生成和顯示條碼圖像，例如Code 39、Code 128和QR Code。 IronBarcode 該庫為開發人員提供了生成具有自定義尺寸、顏色和字體的條碼，以及在條碼圖像中添加文本和標誌的功能。除了生成條碼之外，IronBarcode 還包括讀取和解碼條碼圖像的功能。使用 IronBarcode，開發人員可以輕鬆創建滿足業務需求的強大且動態的 Web 應用程序。欲了解更多相關教程，請訪問以下鏈接 連結. 關於條碼和 QR 碼生成的逐步教程，請參閱以下內容 連結.