如何在Blazor中生成QR碼

本文介紹開發者如何使用IronBarcode庫在C#項目中製作QR Code。

IronBarcode - C

IronBarcode是一個 C# 條碼和 QR 碼函式庫，讓您能在任何 .NET C# 應用程式中輕鬆讀取和生成條碼及 QR 碼。 它優先考量速度、準確性和易於使用 C＃。

IronBarcode 是一個使用者友好的函式庫，允許開發人員在 C# 專案中輕鬆地添加、讀取和設計 QR 碼，通常只需幾分鐘。 它讓開發者能夠以 Aztec、Data Matrix、MaxiCode 等格式生成 QR 碼。 使用 IronBarcode 可以使用不同的條碼類型，例如代碼39、代碼128、RSS14等。

IronBarcode 與所有 .NET Framework 語言相容，即 C#，F#，和 VB.NET。 它支援以下所有 .NET 平台：

• .NET 7、6 和 5
• .NET Core 2x 和 3x
• .NET Standard 2
• .NET Framework 4.6.2+

如何在Blazor伺服器應用程式中生成QR碼？

先決條件

要在 Blazor 網頁應用程式中使用 C# 創建 QR 碼，我們需要以下元件：

1. Visual Studio - 它是一個集成開發環境(集成開發環境)用於 C# 開發。 可以從Visual Studio 網站. 或者您可以使用任何其他支援 C# 的 IDE。

2. Blazor Server App：創建 Blazor Server 應用程式是主要任務。 按照以下步驟創建一個 Blazor 伺服器 Web 應用程式。

   • 打開你的IDE或Visual Studio。 點擊建立新專案。

     

   • 從可用的專案選項中選擇 Blazor Server App。

     

   • 接下來，設置位置並命名您的專案。

     

   • 接下來，為您的專案設定其他資訊。 選擇適當的 .NET Framework 版本。 IronBarcode 支援 .NET 版本 2 到 7，其中 .NET 7 是最新的版本。

     

3. IronBarcode - 一個 .NET QR 碼和條碼庫，幫助生成和讀取不同類型的條碼。以下是安裝 IronBarcode 的不同方法：

4. 直接從網站下載IronBarcodeNuGet網站.

5. 在 Visual Studio 工具中，透過管理方案的 NuGet 套件或在方案總管中右鍵點擊來選擇 NuGet 套件管理器進行安裝。

6. 下載 IronBarcodeDLL直接從Iron Software網站。

添加 IronBarcode 命名空間

一切安裝完畢並準備就緒後，將以下程序集引用添加到 Blazor 條碼應用程式的「Imports.razor」文件：

@using IronBarCode

@using IronBarCode

'INSTANT VB TODO TASK: The following line uses invalid syntax:
'@using IronBarCode

添加授權碼

部署前必須授權使用IronBarcode。 您可以從獲取您的免費試用授權金鑰這裡. 在 Program.cs 文件中添加以下代碼行：

using IronBarCode;
License.LicenseKey = "YOUR-KEY-HERE";

using IronBarCode;
License.LicenseKey = "YOUR-KEY-HERE";

Imports IronBarCode
License.LicenseKey = "YOUR-KEY-HERE"

生成 QR Code 的步驟

以下步驟將幫助您生成 QR 碼在Blazor Server應用程式中以最佳方式：

新增 Blazor HTML 元件

首先，我們將在 "Index.razor" 頁面中添加一些 HTML 程式碼。 該代碼包括一些標題、輸入字段和按鈕。

使用以下程式碼將元件添加到Blazor條碼應用程式：

Welcome to Blazor QR Code Generator
Enter the value to Generate QR Code:

Generate QR Code
Generated QR Code:

Welcome to Blazor QR Code Generator
Enter the value to Generate QR Code:

Generate QR Code
Generated QR Code:

'INSTANT VB TODO TASK: The following line uses invalid syntax:
'Welcome @to Blazor QR Code Generator Enter the value @to Generate QR Code: Generate QR Code Generated QR Code:

輸出如下：

文本欄位用於從使用者處獲取輸入，而生成按鈕將調用 onclick 方法來創建 QR 碼。 生成的 QR 碼將顯示在「生成的 QR 碼：」標題下。 現在，我們來創建 QRCodeGenerater 方法。

創建 QrCodeGenerator 方法

是時候在 Visual Studio 中使用強大的 IronBarcode 庫來生成 QR 碼了。 在 "Index.razor" 頁面中添加了 @code 區段。 讓我們先看看下面的完整代碼：

@code {
    private string qrCode = "";
    private string text = "";

    private void QRCodeGenerator()
    {
        GeneratedBarcode myQRCode = QRCodeWriter.CreateQrCode(text);
        qrCode = Convert.ToString(myQRCode.ToHtmlTag());
    }
}

@code {
    private string qrCode = "";
    private string text = "";

    private void QRCodeGenerator()
    {
        GeneratedBarcode myQRCode = QRCodeWriter.CreateQrCode(text);
        qrCode = Convert.ToString(myQRCode.ToHtmlTag());
    }
}

code
If True Then
	private String qrCode = ""
	private String text = ""

'INSTANT VB TODO TASK: Local functions are not converted by Instant VB:
'	private void QRCodeGenerator()
'	{
'		GeneratedBarcode myQRCode = QRCodeWriter.CreateQrCode(text);
'		qrCode = Convert.ToString(myQRCode.ToHtmlTag());
'	}
End If

在上述代碼中，有兩個私有字串變數。 qrCode 將顯示生成的 QR 碼，而 text 將從輸入欄位獲取用戶輸入。 然後，在 QRCodeGenerator 方法中，myQRCode 是使用 QRCodeWriter 類的 CreateQrCode 方法創建的。 CreateQrCode 方法提供多個參數來增強 QR 碼的輸出。 您可以自訂 QR 碼的大小，設置糾錯碼字以維持糾錯水平，並更改 QrVersion。 以下代碼也能幫助您使用其他參數：

QRCodeWriter.CreateQrCode("https://ironsoftware.com/csharp/barcode/", 500, QRCodeWriter.QrErrorCorrectionLevel.High, 0)

QRCodeWriter.CreateQrCode("https://ironsoftware.com/csharp/barcode/", 500, QRCodeWriter.QrErrorCorrectionLevel.High, 0)

'INSTANT VB TODO TASK: The following line uses invalid syntax:
'QRCodeWriter.CreateQrCode("https://ironsoftware.com/csharp/barcode/", 500, QRCodeWriter.QrErrorCorrectionLevel.High, 0)

最後，生成的 Blazor 條碼被轉換為 HTML 標籤，然後轉換為 qrCode 字串。

從這裡獲取有關 IronBarcode 功能的更多詳細資訊程式碼範例頁面.

在 Blazor 伺服器應用程式首頁顯示

在 "Index.razor" 頁面中的 HTML 元件內，於 H4 標題後添加以下程式碼以顯示 qrCode：

@((MarkupString)qrCode)

@((MarkupString)qrCode)

'INSTANT VB TODO TASK: The following line uses invalid syntax:
'@((MarkupString)qrCode)

另存為 PNG 檔案

您還可以使用 SaveAsPng 方法將其保存為 PNG 文件：

myQRCode.SaveAsPng("myQRCode.png");

myQRCode.SaveAsPng("myQRCode.png");

myQRCode.SaveAsPng("myQRCode.png")

在頁面加載時生成 QR 碼

您也可以在頁面加載時創建 QR 碼，並顯示給用戶以掃描獲取數據。 以下代碼幫助您異步完成此任務：

@((MarkupString)qrCode)

@code {
    private string qrCode = "";
    protected override async Task OnInitializedAsync()
    {
        await Task.Run(() => qrCode = Convert.ToString(QRCodeWriter.CreateQrCode("https://ironsoftware.com/csharp/barcode/", 500, QRCodeWriter.QrErrorCorrectionLevel.High, 0).ToHtmlTag()));
    }
}

@((MarkupString)qrCode)

@code {
    private string qrCode = "";
    protected override async Task OnInitializedAsync()
    {
        await Task.Run(() => qrCode = Convert.ToString(QRCodeWriter.CreateQrCode("https://ironsoftware.com/csharp/barcode/", 500, QRCodeWriter.QrErrorCorrectionLevel.High, 0).ToHtmlTag()));
    }
}

'INSTANT VB WARNING: The following constructor is declared outside of its associated class:
'ORIGINAL LINE: @((MarkupString)qrCode) @code
Private Sub New(ByVal qrCode As (MarkupString))
	private String qrCode = ""
'INSTANT VB TODO TASK: Local functions are not converted by Instant VB:
'	protected override async Task OnInitializedAsync()
'	{
'		await Task.Run(() => qrCode = Convert.ToString(QRCodeWriter.CreateQrCode("https://ironsoftware.com/csharp/barcode/", 500, QRCodeWriter.QrErrorCorrectionLevel.High, 0).ToHtmlTag()));
'	}
End Sub

摘要

在本文中，我們學習了如何使用IronBarcode在Blazor Server應用程式中以C#生成QR碼。 IronBarcode 是一個靈活的庫，並為 Blazor 應用提供所有必要的方法和支持。

IronBarcode 輕鬆將純文字、圖片、影片或任何其他數據轉換為 QR 碼。 您可以控制代碼大小、錯誤更正等級及其版本。 您可以使用IronBarcode來掃描Blazor應用程式中的條碼。 完整範例是這裡.

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