C# QR Code Generator Library
How to generate QR Code barcode using C# in ASP.NET Core web application

In this C# tutorial, you will learn how to create a QR Code 2d barcode image using C# in ASP.NET Core Razor pages

• Setup a new ASP.NET Core web app and install packages and QR Code generator dlls
• Create a Razor page to input QR Code data message
• Generate and display QR Code image on the Razor page

How to create QR Code barcodes in ASP.NET Core web app using C#

1. Download XImage.Barcode Generator C# library
2. Install C# library to draw QR Code barcodes
3. Step by Step Tutorial

Free Download

Prerequisites

Download and install the following software on your computer

• Visual Studio 2022
• .NET 6.0 SDK
• RasterEdge Document Image .NET SDK free trial package

How to create QR Code barcode in ASP.NET Core web app using C#?

1. Create a new ASP.NET Core web app

Start Visual Studio 2022 and choose "Create a new project".



Choose "ASP.NET Core Web App" in the dialog, and then press "Next" button.



Create a new ASP.NET Core Web App project with name "RasterEdge.QRCodeGenerator.ASPNETCoreDemo".



Choose Framework as ".NET 6.0 (Long-term support)", and then press "Create" button.



Now, all Visual Studio generated files could be found in the Solution Explorer panel.



Open the file "Program.cs" and ensure that it has enabled following Middlewares.

var builder = WebApplication.CreateBuilder(args);

// Add services to the container.
builder.Services.AddRazorPages();

var app = builder.Build();

// Configure the HTTP request pipeline.
if (!app.Environment.IsDevelopment())
{
    app.UseExceptionHandler("/Error");
}
app.UseStaticFiles();

app.UseRouting();

app.UseAuthorization();

app.MapRazorPages();

app.Run();

2. Install NuGet Packages and RasterEdge QR Code Generator DLLs

To install QR Code generator dlls in your .NET Core projects, please go to page How to install DLLs on .NET Core app

3. Add C# code to create QR Code in ASP.NET Core web app

Copy all following codes to replace the content of the file "Index.cshtml".

The cshtml page code will

• Add one text box to allow user to key in QR Code data message
• One submit button to generate and update QR Code image
• An image to display the generated QR Code barcode

@page
@model IndexModel
@{
    ViewData["Title"] = "Home page";
}

<div class="text-center">
    <form asp-page="./Index" method="post">
        <br />
        QR Code Data Message:
        <input type="text" id="tb1" name="tbMessage" style="width: 600px; " asp-for="@Model.Message" />
        <br />
        <br />
        <input type="submit" value="Create Barcode" />
    </form>
    <br />
    <img src="data:image/png;base64,@Model.BarcodeImage" />
</div>

Copy all following codes to replace the content in the file "Index.cshtml.cs".

The cshtml.cs C# source code will

• Create a new QRCode barcode object
• Set the QR Code object with data message from text box
• Apply the QR Code data mode, barcode dimension size (width and height) settings, and image resolution
• Call method QRCode.DrawBarcode() to create QR Code in a PNG image file and return the image file in byte array
• Display the generated QR Code on the web page

using Microsoft.AspNetCore.Mvc;
using Microsoft.AspNetCore.Mvc.RazorPages;
using RasterEdge.XImage.BarcodeCreator;

namespace RasterEdge.QRCodeGenerator.ASPNETCoreDemo.Pages
{
    public class IndexModel : PageModel
    {
        public String Message { get; set; } = "";
        public String BarcodeImage { get; set; } = "";

        public void OnGet()
        {
        }

        public Task<IActionResult> OnPost()
        {
            this.Message = Request.Form["tbMessage"].ToString();

            QRCode barcode = new QRCode();

            barcode.Data = this.Message;

            barcode.DataMode = QRCodeDataMode.Auto;

            barcode.AutoResize = true;
            barcode.UOM = UnitOfMeasure.INCH;
            barcode.BarcodeWidth = 2F;
            barcode.BarcodeHeight = 2F;
            barcode.Resolution = 300;

            byte[] dataBytes = barcode.DrawBarcode(OutputFileType.PNG);

            BarcodeImage = System.Convert.ToBase64String(dataBytes);

            return Task.FromResult<IActionResult>(Page());
        }

    }
}

4. Run web app

It is done. Now run the project.



It will launche the Kestrel web server and opens the default web browser.

Key in the QR Code characters in text box, and click the button "Create Barcode" to generate and display QR Code barcode image on the web page.