QR Code é uma forma eficiente e conveniente para armazenar a compartilhar dados. Com NodeJS podemos criar e ler QR Codes de forma fácil e rápida, veremos com detalhes a seguir.
Nesse passo a passo veremos cada etapa para criar e ler QR Codes usando Node.JS, para isso, faremos o uso de três populares bibliotecas: qrcode-reader e jimper para ler QR Codes e qrcode para gerar QR Codes.
Resumo:
- Criando QR Codes em Node.JS
Instalando a biblioteca qrcode
Gerando imagem de QR Code - Lendo QR Codes em Node.JS
Instalando as bibliotecas qrcode-reader e jimper
Lendo QR codes a partir dos arquivos de imagens
Criando QR Codes em Node.JS
A biblioteca qrcode disponibiliza um API simples e fácil para criar QR Codes.
Instalando a biblioteca qrcode
Para instalar a biblioteca, vamos precisar de Node.JS e NPM (o gerenciador de pacotes do Node) - também podem ser utilizados outros gerenciados de pacotes do node, como Yarn, Pnpm etc... - instalados no computador. Caso você ainda não tenha essas ferramentas, você poderá baixar diretamente no site do Node.JS.
Após ter as ferramentas devidamente instaladas, podemos criar uma nova pasta para o projeto e instalar a biblioteca qrcode usando NPM, ou seu gerenciador de pacotes de preferência.
Então abra seu terminal e execute os seguinte comandos:
mkdir qrcode-tool && cd qrcode-tool
O comando mkdir cria uma nova pasta chamada qrcode-tool e em seguida navega para dentro da pasta com o comando cd.
Em seguida, podemos iniciar um novo projeto Node.JS com o comando:
npm init -y
Esse comando irá gerar um arquivo chamado package.json, que será o arquivo responsável por armazenar todas as referências de bibliotecas utilizadas na construção do projeto.
Em seguida, podemos abrir a pasta do projeto no editor de código de preferencia, no meu caso, estou utilizando o VSCode, então irei usar o comando:
code .
No VSCode, temos um terminal integrado, ao usar o atalho CTRL + J, um novo terminal irá abrir na parte inferior do editor.
Finalmente com a estrutura inicial do projeto pronta, podemos instalar a biblioteca qrcode com o seguinte comando:
npm install qrcode
Gerando imagem de QR Code
Para gerar uma imagem de QR Code, podemos usar o método toFile da biblioteca qrcode. Nesse método podemos enviar três parâmetros, o caminho do arquivo, o texto para transformar em QR Code e um objeto opcional de outros argumentos, e assim gerar a imagem de QR Code no caminho especificado.
Abaixo um exemplo de como usar o método toFile para gerar uma imagem QR Code:
const QRCode = require('qrcode'); QRCode.toFile('./output-file-path/file.png', 'Encode this text in QR code', { errorCorrectionLevel: 'H' }, function(err) { if (err) throw err; console.log('QR code saved!'); });
Esse código irá gerar a imagem QR Code com o texto especificado e salvar no caminho de saída indicado.
Para fazer o teste, dentro da pasta do seu projeto crie um novo arquivo js, por exemplo, gerarQRCode.js e também uma pasta de nome output-file-path (o mesmo nome utilizado no exemplo acima), e então no terminal execute o código:
node gerarQRCode.js
Se tudo estiver correto, você verá no seu terminal a mensagem "QR Code saved!", e poderá ver a imagem de QR Code dentro da pasta output-file-path, caso queira ver o resultado em algum dispositivo, basta abrir a imagem e fazer a leitura com algum leitor de QR Code, você deve conseguir ver o texto "Encode this text in QR code".
Além de gerar arquivos de imagem de QR Code, a biblioteca qrcode também permite gerar imagens de QR Code em outros formatos, como JPEG ou SVG. Para fazer isso, você pode usar o método toString, que retorna uma string contendo os dados da imagem do QR Code no formato especificado.
Aqui está um exemplo de como usar o método toString para gerar uma imagem de QR Code no formato SVG:
const QRCode = require('qrcode'); QRCode.toString('Encode this text in QR code', { errorCorrectionLevel: 'H', type: 'svg' }, function(err, data) { if (err) throw err; console.log(data); });
Este código irá gerar uma imagem de QR Code com o texto especificado, e retorná-lo como uma string de dados SVG. Você pode então usar esses dados para exibir a imagem do QR Code em um navegador ou outra aplicação.
Você pode escanear o QR Code abaixo e ver a string que você deu como entrada para o método toString no trecho de código acima.
Está será a saída:
Lendo QR Codes em Node.JS
Nesta seção, você irá ler o arquivo de QR Code que você gerou e salvou na seção anterior.
Para ler QR Code no Node, você usará as bibliotecas qrcode-reader e jimp. Essas bibliotecas fornecem APIs simples para analisar e ler QR Codes de imagens e fontes de vídeo.
Instalando as bibliotecas qrcode-reader e jimp
Para instalar as bibliotecas qrcode-reader e jimp, você precisará novamente instalar os pacotes npm necessários para ler códigos QR.
Abra uma janela de terminal e execute o seguinte comando:
npm install qrcode-reader jimp
Este comando irá instalar as bibliotecas qrcode-reader e jimp, permitindo que você use-as em sua aplicação. Lembre-se de estar na pasta do projeto quando executar este comando.
Lendo QR codes a partir dos arquivos de imagens
Para ler QR Codes de arquivos de imagem, você pode usar o método decode do módulo qrcode-reader e o método read do módulo jimp. O método read do jimp analisa a imagem, que será decodificada pelo método decode do módulo qrcode-reader.
Aqui está um exemplo de como usar os métodos read e decode para ler um código QR da imagem que salvamos anteriormente:
// __ Importing jimp __ \\ const Jimp = require("jimp"); // __ Importing filesystem = __ \\ const fs = require('fs') // __ Importing qrcode-reader __ \\ const qrCodeReader = require('qrcode-reader'); // __ Read the image and create a buffer __ \\ const buffer = fs.readFileSync('./output-file-path/file.png'); // __ Parse the image using Jimp.read() __ \\ Jimp.read(buffer, function(err, image) { if (err) { console.error(err); } // __ Creating an instance of qrcode-reader __ \\ const qrCodeInstance = new qrCodeReader(); qrCodeInstance.callback = function(err, value) { if (err) { console.error(err); } // __ Printing the decrypted value __ \\ console.log(value.result); }; // __ Decoding the QR code __ \\ qrCodeInstance.decode(image.bitmap); });
Este código lerá o QR Code do arquivo de imagem e registrará o resultado no console. Se o QR Code for decodificado com sucesso, o resultado será uma string contendo o texto do QR Code. Se o QR Code não puder ser decodificado, o resultado será nulo.
Para testar esse código, você pode criar um arquivo com nome readQRCode.js por exemplo e colar todo o código acima, em seguida basta rodar o comando:
node readQRCode.js
Na saída abaixo, você pode ver a string que codificamos usando a biblioteca qrcode.
Esse será o resultado:
Encode this text in QR code
É possível ver que a biblioteca qrcode é muito útil e pode ser usada com diferentes parâmetros para criar QR Codes. A melhor coisa sobre essa biblioteca é que ela pode funcionar tanto com aplicativos React.js quanto com servidores Node.js.
Conclusão
Neste tutorial, aprendemos como armazenar e compartilhar informações de maneira conveniente e eficiente usando QR Code. Seja para codificar dados para um aplicativo web ou móvel, isso pode ser facilmente realizado usando o ambiente do Node. Também aprendemos como codificar dados em diferentes formas em um QR Code, como um arquivo SVG.
Em resumo, aprendemos a usar a biblioteca qrcode no Node.js para gerar e ler QR Codes em vários formatos, como SVG e JPEG. Os QR Codes podem ser uma ferramenta útil para armazenar e compartilhar informações de maneira conveniente e eficiente em vários aplicativos.