Wie man QR-Code in Blazor generiert

Die folgenden Schritte helfen, QR-Codes zu generieren auf die bestmögliche Weise in einer Blazor Server-Anwendung:

Hinzufügen von Blazor HTML-Komponenten

Zuerst werden wir etwas HTML-Code zur "Index.razor"-Seite hinzufügen. Der Code besteht aus einigen Überschriften, einem Eingabefeld und Schaltflächen.

Verwenden Sie den untenstehenden Code, um die Komponenten zur Blazor Barcode-App hinzuzufügen:

<h4>Welcome to Blazor QR Code Generator</h4>
<p>Enter the value to Generate QR Code:</p>

<input @bind="text" />

<button @onclick="QRCodeGenerater">Generate QR Code</button>

<p>Generated QR Code:</p>

<h4>Welcome to Blazor QR Code Generator</h4>
<p>Enter the value to Generate QR Code:</p>

<input @bind="text" />

<button @onclick="QRCodeGenerater">Generate QR Code</button>

<p>Generated QR Code:</p>

Das Ergebnis ist wie folgt:

Das Textfeld wird verwendet, um Eingaben vom Benutzer zu erhalten, und der Generierungsknopf ruft die QRCodeGenerater-Methode auf, um einen QR-Code zu erstellen. Der erstellte QR-Code wird unter der Überschrift "Generierter QR-Code:" angezeigt. Nun, lassen Sie uns die QRCodeGenerater-Methode erstellen.

Erstellen Sie die QRCodeGenerater-Methode

Es ist an der Zeit, die leistungsstarke IronBarcode-Bibliothek in Visual Studio zu verwenden, um QR-Codes zu generieren. Der @code-Abschnitt wird zur "Index.razor"-Seite hinzugefügt. Sehen wir uns zuerst den vollständigen Code unten an:

@code {
    // Variable to hold the generated QR code HTML
    private string qrCode = "";

    // Variable to hold user input text
    private string text = "";

    // Method to generate QR code from user input
    private void QRCodeGenerater()
    {
        // Create a QR code from the input text
        GeneratedBarcode myQRCode = QRCodeWriter.CreateQrCode(text);

        // Convert the generated QR code to HTML tag
        qrCode = Convert.ToString(myQRCode.ToHtmlTag());
    }
}

Im obigen Code gibt es zwei private String-Variablen. qrCode zeigt den generierten QR-Code an, und text erhält die Benutzereingabe aus dem Eingabefeld. Dann wird in der QRCodeGenerater-Methode myQRCode mit der Methode CreateQrCode der QRCodeWriter-Klasse erstellt. Die CreateQrCode-Methode bietet mehrere Parameter, um die Codeausgabe zu verbessern. Sie können die Größe des QR-Codes anpassen, Fehlerkorrektur-Codewörter festlegen, um das Fehlerkorrekturniveau zu halten, und die QrVersion ändern. Der untenstehende Code hilft Ihnen dabei, auch mit anderen Parametern zu arbeiten:

// Creating a QR code with custom parameters
QRCodeWriter.CreateQrCode(
    "https://ironsoftware.com/csharp/barcode/", // URL for the QR code
    500, // Size of the QR code
    QRCodeWriter.QrErrorCorrectionLevel.High, // Error correction level
    0 // QrVersion
)

// Creating a QR code with custom parameters
QRCodeWriter.CreateQrCode(
    "https://ironsoftware.com/csharp/barcode/", // URL for the QR code
    500, // Size of the QR code
    QRCodeWriter.QrErrorCorrectionLevel.High, // Error correction level
    0 // QrVersion
)

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

Schließlich wird der generierte Blazor-Barcode in ein HTML-Tag und dann in eine qrCode-Zeichenfolge konvertiert.

Erfahren Sie mehr über die Funktionen von IronBarcode auf dieser Code-Beispiel-Seite.

Anzeige auf der Startseite der Blazor Server-Anwendung

Fügen Sie den untenstehenden Code in die HTML-Komponenten auf der "Index.razor"-Seite nach der H4-Überschrift ein, um qrCode anzuzeigen:

@((MarkupString)qrCode)

Als PNG-Datei speichern

Sie können es auch mit der SaveAsPng-Methode in einer PNG-Datei speichern:

// Save the generated QR code as a PNG file
myQRCode.SaveAsPng("myQRCode.png");

// Save the generated QR code as a PNG file
myQRCode.SaveAsPng("myQRCode.png");

' Save the generated QR code as a PNG file
myQRCode.SaveAsPng("myQRCode.png")