Hoje eu vou mostrar como podemos gerar QRCode usando a API do Google de forma bem simples.
A API do Google Chart Tools, também conhecida como Chart API, faz parte do projeto Google Visualization que engloba a ferramenta Interactive Charts. Sua principal vantagem é a simplicidade, já que tudo o que você precisa fazer para usá-la é uma chamada para sua URL, enviando os dados do gráfico via query string. A chamada retornará a imagem do gráfico.
Neste artigo, eu vou mostrar como podemos gerar QRCode usando os recursos da Chart API do Google.
A API é possui três especificações principais:
- cht=qr – é o tipo de gráfico a utilizar, que neste caso será o QRCode;
- chl=<texto do código> – é o texto que vamos incluir no código gerado;
- choe=<tipo de output encoding> – será o UTF pretendido, Shift_JIS, UTF-8, ou ISO-8859-1 (valor opcional).
Também podemos colocar as dimensões da imagem gerada no código com a especificação chs.
O url deverá ficar da seguinte forma: http://chart.apis.google.com/chart?cht=qr&chl=http://www.macortti.net&chs=120×120
Se digitar este endereço no seu navegador, você deverá visualizar o QRCode gerado:
Recursos usados:
Criando o projeto no Visual Studio 2013 Express for web
Abra o VS Express 2013 for web e clique em New Web Site. A seguir, selecione a linguagem Visual C# e o template ASP .NET Web Application.
Informe o nome QRCode_GoogleAPI e clique no botão OK.
No menu WEBSITE, clique em Add New Item. Em seguida, selecione o template Web Form e informe o nome Default.aspx e clique no botão Add.
A seguir, a partir da ToolBox, inclua um controle Button com ID=btnGerarQRCode e um TextBox com ID=txtTexto a partir da Toolbox na página Default.aspx;
Informe um texto acima da caixa de texto e disponha os controles conforme o leiaute da figura abaixo:
<%@ Page Language="VB" AutoEventWireup="false" CodeFile="Default.aspx.vb" Inherits="_Default" %> <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title></title> </head> <body> <form id="form1" runat="server"> <div> <h2>Macoratti.net</h2> <hr /> Informe um link ou texto<br /> <asp:TextBox ID="txtTexto" runat="server" name="site" value="www." Width="200px"></asp:TextBox> <p/> <asp:Button ID="btnGerarQRcode" runat="server" Text="Gerar QRCode" Width="145px" /> </div> </form> </body> </html>
Agora no arquivo code-behind Default.aspx.vb inclua o código abaixo no evento Click do botão de comando Gerar QRCode:
Protected Sub btnGerarQRcode_Click(sender As Object, e As EventArgs) Handles btnGerarQRcode.Click Dim url As String url = "QrCode.aspx?texto=" + txtTexto.Text Response.Redirect(url) End Sub
Este código redireciona o usuário para a página QrCode.aspx, passando uma querystring com o nome texto com o conteúdo do texto, informando na caixa de textotxtTexto do formulário Default.aspx.
Vamos então incluir a página QrCode.aspx no projeto: no menu WEBSITE clique em Add New Item e selecione o template Web Form, informando o nome QrCode.aspx e clicando depois no botão Add.
A seguir, abra esta página no modo Source e defina o código abaixo:
<%@ Page Language="VB" AutoEventWireup="false" CodeFile="QrCode.aspx.vb" Inherits="QrCode" %> <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <meta http-equiv="refresh" content="5; url=http://chart.apis.google.com/chart?cht=qr&chl=http://<%= Request.QueryString("texto") %>&chs=120x120"/> <title>QR Code em ASP .NET Utilizando Google API</title> </head> <body> <form id="form1" runat="server"> <div> Aguarde ................ </div> </form> </body> </html>
Agora, executando o projeto, teremos a página Default.aspx apresentada.
Digitando um texto na caixa de texto e clicando no botão de comando – Gerar QRCode, após alguns segundos, teremos a geração do QRCode conforme a figura a seguir:
Pegue o projeto completo aqui: QrCode_GoogleAPI.zip
Veja também vídeo aula para este artigo em: VB .NET – Gerando, Salvando e Lendo QRCode