Wie man QR-Codes in ASP.NET MVC generiert

Installieren Sie Iron Barcode

Um zu beginnen, öffnen Sie die Package Manager Console in Visual Studio und führen Sie den folgenden Befehl aus:

Install-Package IronBarCode

Dieser Befehl installiert die Iron Barcode-Bibliothek und fügt die notwendigen Referenzen zu Ihrem Projekt hinzu.

!

Jetzt schreiben wir etwas Code, um QR-Codes zu erstellen.

Erstellen Sie QRCodeModel

Erstellen Sie eine Modellklasse im Ordner Models und schreiben Sie folgenden Code:

using System.ComponentModel.DataAnnotations;

public class QRCodeModel
{
    [Display(Name = "Enter QR Code Text")]
    public string QRCodeText { get; set; }
}

using System.ComponentModel.DataAnnotations;

public class QRCodeModel
{
    [Display(Name = "Enter QR Code Text")]
    public string QRCodeText { get; set; }
}

Imports System.ComponentModel.DataAnnotations

Public Class QRCodeModel
	<Display(Name := "Enter QR Code Text")>
	Public Property QRCodeText() As String
End Class

Erstellen Sie einen QR-Code-Controller

Erstellen Sie in Ihrem ASP.NET MVC-Projekt einen neuen Controller namens QrCodeController. Dazu klicken Sie mit der rechten Maustaste auf den Controllers-Ordner in Ihrer Projektstruktur, wählen „Hinzufügen“ und dann „Controller“. Wählen Sie aus den verfügbaren Optionen „MVC-Controller - Leer“.

Schreiben Sie den folgenden Code in QrCodeController:

using Microsoft.AspNetCore.Mvc;
using IronBarCode;
using System.IO;

public class QrCodeController : Controller
{
    private readonly IWebHostEnvironment _environment;

    public QrCodeController(IWebHostEnvironment environment)
    {
        _environment = environment;
    }

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

    [HttpPost]
    public IActionResult CreateQRCode(QRCodeModel generateQRCode)
    {
        try
        {
            // Creating QR Code
            GeneratedBarcode barcode = QRCodeWriter.CreateQrCode(generateQRCode.QRCodeText);
            string path = Path.Combine(_environment.WebRootPath, "GeneratedQRCode");

            if (!Directory.Exists(path))
            {
                Directory.CreateDirectory(path);
            }

            string filePath = Path.Combine(path, "qrcode.png");
            barcode.SaveAsPng(filePath);

            string fileName = Path.GetFileName(filePath);
            string imageUrl = $"{this.Request.Scheme}://{this.Request.Host}{this.Request.PathBase}/GeneratedQRCode/{fileName}";

            ViewBag.QrCodeUri = imageUrl;
        }
        catch (Exception ex)
        {
            // Handle exceptions
            // Log the exception details here for troubleshooting and debugging.
            throw;
        }

        return View();
    }
}

using Microsoft.AspNetCore.Mvc;
using IronBarCode;
using System.IO;

public class QrCodeController : Controller
{
    private readonly IWebHostEnvironment _environment;

    public QrCodeController(IWebHostEnvironment environment)
    {
        _environment = environment;
    }

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

    [HttpPost]
    public IActionResult CreateQRCode(QRCodeModel generateQRCode)
    {
        try
        {
            // Creating QR Code
            GeneratedBarcode barcode = QRCodeWriter.CreateQrCode(generateQRCode.QRCodeText);
            string path = Path.Combine(_environment.WebRootPath, "GeneratedQRCode");

            if (!Directory.Exists(path))
            {
                Directory.CreateDirectory(path);
            }

            string filePath = Path.Combine(path, "qrcode.png");
            barcode.SaveAsPng(filePath);

            string fileName = Path.GetFileName(filePath);
            string imageUrl = $"{this.Request.Scheme}://{this.Request.Host}{this.Request.PathBase}/GeneratedQRCode/{fileName}";

            ViewBag.QrCodeUri = imageUrl;
        }
        catch (Exception ex)
        {
            // Handle exceptions
            // Log the exception details here for troubleshooting and debugging.
            throw;
        }

        return View();
    }
}

Imports Microsoft.AspNetCore.Mvc
Imports IronBarCode
Imports System.IO

Public Class QrCodeController
	Inherits Controller

	Private ReadOnly _environment As IWebHostEnvironment

	Public Sub New(ByVal environment As IWebHostEnvironment)
		_environment = environment
	End Sub

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

	<HttpPost>
	Public Function CreateQRCode(ByVal generateQRCode As QRCodeModel) As IActionResult
		Try
			' Creating QR Code
			Dim barcode As GeneratedBarcode = QRCodeWriter.CreateQrCode(generateQRCode.QRCodeText)
			Dim path As String = System.IO.Path.Combine(_environment.WebRootPath, "GeneratedQRCode")

			If Not Directory.Exists(path) Then
				Directory.CreateDirectory(path)
			End If

			Dim filePath As String = System.IO.Path.Combine(path, "qrcode.png")
			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}/GeneratedQRCode/{fileName}"

			ViewBag.QrCodeUri = imageUrl
		Catch ex As Exception
			' Handle exceptions
			' Log the exception details here for troubleshooting and debugging.
			Throw
		End Try

		Return View()
	End Function
End Class

Dieser Code richtet einen Controller ein, der QR-Codes erzeugen kann. Wenn die CreateQRCode-Aktion aufgerufen wird, nimmt sie den Text für den QR-Code, generiert das QR-Code-Bild, speichert es und stellt die URL für das Bild in der Ansicht zur Anzeige bereit. Im Detail sieht es wie folgt aus:

• Der Controller verfügt über einen Konstruktor, der einen IWebHostEnvironment-Parameter verwendet, um auf die Webhosting-Umgebung zuzugreifen.
• Die CreateQRCode-Aktion gibt eine Ansicht zurück.
• Die CreateQRCode-Aktion mit dem Attribut [HttpPost] nimmt einen QRCodeModel-Parameter an, der den QR-Code-Text enthält.
• Innerhalb der Aktion wird ein QR-Code mit der Klasse QRCodeWriter aus der Iron Barcode-Bibliothek erzeugt.
• Der erzeugte QR-Code wird als PNG-Bilddatei in einem Ordner namens GeneratedQRCode im Web-Stammverzeichnis gespeichert.
• Wenn der GeneratedQRCode-Ordner nicht existiert, wird er erstellt.
• Der Dateipfad und die URL für das gespeicherte QR-Code-Bild werden generiert.
• Die URL des QR-Code-Bildes wird in der Eigenschaft ViewBag.QrCodeUri gespeichert, um in der Ansicht verwendet zu werden.
• Alle während des Prozesses auftretenden Ausnahmen werden abgefangen und protokolliert.

Hinzufügen der CreateQRCode-Ansicht

Um eine neue Ansicht hinzuzufügen, klicken Sie mit der rechten Maustaste auf die CreateQRCode-Aktionsmethode in der QrCodeController-Klasse. Wählen Sie „Ansicht hinzufügen“, dann „Razor View“ aus, und klicken Sie auf die Schaltfläche „Hinzufügen“.

!

Ein neues Fenster wird wie unten dargestellt erscheinen.

!

Geben Sie den Namen der Ansicht ein, wählen Sie die Vorlage „Erstellen“ aus und wählen Sie unsere neu erstellte Modellklasse QRCodeModel. Klicken Sie auf die Schaltfläche „Hinzufügen“. Die Ansicht wird erstellt. Ersetzen Sie Ihre Ansicht durch den nachstehenden Code.

@model QRCodeModel

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

<h1>Create QRCode in ASP.NET MVC</h1>

<hr />
<div class="row">
    <div class="col-md-4">
        <form asp-action="CreateQRCode">
            <div asp-validation-summary="ModelOnly" class="text-danger"></div>
            <div class="form-group">
                <label asp-for="QRCodeText" class="control-label"></label>
                <input asp-for="QRCodeText" class="form-control" />
                <span asp-validation-for="QRCodeText" class="text-danger"></span>
            </div>
            <div class="form-group">
                <input type="submit" value="Create" class="btn btn-primary" />
            </div>
            <div class="form-group">
                @if (ViewBag.QrCodeUri != null)
                {
                    <img src="@ViewBag.QrCodeUri" class="img-thumbnail" alt="Generated QR Code" />
                }
            </div>
        </form>
    </div>
</div>

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

Gehen wir nun zur Klasse Program.cs und ändern die Standard-Controller-Route.

app.MapControllerRoute(
    name: "default",
    pattern: "{controller=QrCode}/{action=CreateQRCode}/{id?}"
);

app.MapControllerRoute(
    name: "default",
    pattern: "{controller=QrCode}/{action=CreateQRCode}/{id?}"
);

app.MapControllerRoute(name:= "default", pattern:= "{controller=QrCode}/{action=CreateQRCode}/{id?}")

Dies ändert die Standardroute vom HomeController zu unserem QrCodeController.

Kompilieren und führen Sie das Projekt jetzt aus.

Ausgabe

!

Geben Sie Text in das Textfeld ein und klicken Sie auf die Schaltfläche zum Erstellen. Ein QR-Code wird erstellt und wie unten gezeigt auf dem Bildschirm angezeigt.

!

Fügen wir nun visuelle Styles zu unserem Barcode hinzu, indem wir Annotationstext, QR-Code-Wert hinzufügen und die QR-Code-Farbe ändern.

Visuelle Styles im QR-Code hinzufügen

Fügen Sie die folgende Codezeile in die CreateQRCode-Aktionsmethode ein.

barcode.AddAnnotationTextAboveBarcode("QR Code Generated by Iron PDF");
barcode.AddBarcodeValueTextBelowBarcode();
barcode.ChangeBackgroundColor(System.Drawing.Color.White);
barcode.ChangeBarCodeColor(System.Drawing.Color.MediumVioletRed);

barcode.AddAnnotationTextAboveBarcode("QR Code Generated by Iron PDF");
barcode.AddBarcodeValueTextBelowBarcode();
barcode.ChangeBackgroundColor(System.Drawing.Color.White);
barcode.ChangeBarCodeColor(System.Drawing.Color.MediumVioletRed);

barcode.AddAnnotationTextAboveBarcode("QR Code Generated by Iron PDF")
barcode.AddBarcodeValueTextBelowBarcode()
barcode.ChangeBackgroundColor(System.Drawing.Color.White)
barcode.ChangeBarCodeColor(System.Drawing.Color.MediumVioletRed)

Führen Sie das Projekt jetzt aus und erzeugen Sie den QR-Code.

!