ASP.NET Core - Criando código QRCode rápido e fácil
 Hoje vou mostrar mais uma opção para gerar código QRCode de forma bem simples e rápida usando ASP.NET Core MVC.


Os códigos QR são códigos de barras bidimensionais que podem ser digitalizados por smartphones e outros dispositivos e podem conter informações como URLs, texto ou informações de contato.

 


 

Neste artigo vou mostrar como podemos gerar código QR de forma simples e rápida em uma aplicação ASP .NET Core MVC. Para isso vamos usar o pacote Nuget : BarCode
 

 

Vamos ao trabalho...

 

Criando a aplicação ASP .NET Core MVC

 

Abra o VS 2022 e crie um novo projeto ASP.NET Core MVC com o nome MvcQRCode.

 

A seguir inclua no projeto o pacote nuget : QRCoder via menu Tools-> ..-> Manage Nuget Package for Solution

                               

Se preferir pode instalar o pacote usando o comando : install-package IronBarCode

 

Vamos limpar o código do controlador HomeController gerado na pasta Controllers deixando apenas o método Action Index.

 

public class HomeController : Controller
{
    public IActionResult Index()
    {
        return View();
    }
}

A seguir vamos injetar no construtor da classe HomeController uma instância de IWebHostEnvironment :

public class HomeController : Controller
{

   private readonly IWebHostEnvironment _environment;
   public HomeController(IWebHostEnvironment environment)
   {
     _environment = environment;
   }

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

Na pasta Models do projeto vamos criar a classe QRCodeModel que vai ser o modelo de dados para gerar o QR Code :

public class QRCodeModel
{
    [Display(Name = "Informe o texto")]
    public string? QRCodeTexto { get; set;}
}

Vamos alterar o código da view Index.cshtml conforme abaixo:

@model QRCodeModel

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

<h2>Gerar QRCode</h2>

<div class="row">
    <div class="col-md-4">
        <form asp-action="Index">
            <div asp-validation-summary="ModelOnly" class="text-danger"></div>
            <div class="form-group">
                <label asp-for="QRCodeTexto" class="control-label"></label>
                <input asp-for="QRCodeTexto" class="form-control" />
                <span asp-validation-for="QRCodeTexto" class="text-danger"></span>
            </div>
            <div class="form-group pt-2 pb-2">
                <input type="submit" value="Gerar QR Code" class="btn btn-primary" />
            </div>
            <div class="form-group">
                <img src="@ViewBag.QrCodeUri" class="img-thumbnail" />
            </div>
        </form>
    </div>
</div>

 

Temos nesta view um formulário onde o usuário vai informar os dados e ao clicar no botão submit os dados serão postados e recebidos no método Action Index,


Para concluir precisamos criar o método Action HttpPost Index no controlador HomeController.

 

    [HttpPost]
    public IActionResult Index(QRCodeModel gerarQRCode)
    {
        try
        {
            GeneratedBarcode barcode = QRCodeWriter.CreateQrCode(gerarQRCode.QRCodeTexto, 200);
            barcode.AddBarcodeValueTextBelowBarcode();

            // aplicar estilo ao QR code e texto
             barcode.SetMargins(10);
            barcode.ChangeBarCodeColor(Color.BlueViolet);
            string path = Path.Combine(_environment.WebRootPath, "qrcodes");

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

            string filePath = Path.Combine(_environment.WebRootPath, "qrcodes/qrcode.png");

            barcode.SaveAsPng(filePath);

            string fileName = Path.GetFileName(filePath);
            string imageUrl = $"{this.Request.Scheme}://{this.Request.Host}{this.Request.PathBase}" + "/qrcodes/" + fileName;
            ViewBag.QrCodeUri = imageUrl;
        }
        catch (Exception)
        {
            throw;
        }
        return View();
    }

 

 

Este código recebe os dados postados do formulário e gera os dados usando o método CreateQrCode().

 

A seguir podemos aplicar um estilo ao QR Code gerado onde definimos a cor de fundo como BlueViolet.

 

Depois salvamos o arquivo qrcode.png gerado na pasta qrcodes, que será criada se não existir,  e exibimos o QR Code gerado na página.

 

Executando o projeto teremos o seguinte resultado:

 


Podemos verificar a pasta wwwroot/qrcodes e ver o arquivo gerado:

 


Pegue o projeto aqui:   QRCodeMvc.zip (sem as referências) 
 

"Porque não nos chamou Deus para a imundícia, mas para a santificação"
1 Tessalonicenses 4:7
 

Porque um menino nos nasceu, um filho se nos deu, e o principado está sobre os seus ombros, e se chamará o seu nome: Maravilhoso, Conselheiro, Deus Forte, Pai da Eternidade, Príncipe da Paz.

Isaías 9:6
Porque um menino nos nasceu, um filho se nos deu, e o principado está sobre os seus ombros, e se chamará o seu nome: Maravilhoso, Conselheiro, Deus Forte, Pai da Eternidade, Príncipe da Paz.

Isaías 9:6

Referências:

José Carlos Macoratti