Sling Academy
Home/Node.js/How to generate QR codes in Node.js

How to generate QR codes in Node.js

Last updated: February 05, 2024

Introduction to QR Codes

QR codes (Quick Response codes) are two-dimensional barcodes that can store a significant amount of data, which can be scanned using smartphones and other devices. They offer a quick and efficient means of encoding information ranging from URLs and contact details to Wi-Fi passwords and payment information.

In the era of rapid technological advancement, QR codes have become a ubiquitous tool for quickly accessing information, making payments, and sharing data. In this comprehensive tutorial, we’ll delve into the world of QR code generation within a Node.js environment, offering a step-by-step guide replete with code examples and best practices.

Prerequisites

  • Node.js installed on your system.
  • Basic understanding of JavaScript and Node.js.
  • An IDE or code editor of your choice.

Getting Started

To generate QR codes in a Node.js application, we will utilize the popular ‘qrcode’ library. This library provides an easy-to-use interface for creating QR codes with various customization options. Start by initiating a new Node.js project:

mkdir qr-code-project
cd qr-code-project
npm init -y
npm install qrcode --save

Generating Your First QR Code

With the project setup complete, let’s dive into generating our first QR code. Create a file called generateQR.js and include the following code:

const QRCode = require('qrcode');

QRCode.toDataURL('https://www.example.com', function (err, url) {
  if (err) throw err;
  console.log('Your QR Code:', url);
});

This simple script generates a QR code for the URL 'https://www.example.com' and outputs a data URL that can be used in web pages or saved as an image file.

Advanced QR Code Generation

QR codes can do more than just encode URLs. They can contain contacts, emails, and even Wi-Fi network details. Let’s enhance our application to generate a more complex QR code containing VCard information:

const QRCode = require('qrcode');

const generateVCardQR = () => {
  const vCardData = `BEGIN:VCARD\nVERSION:3.0\nN:Doe;John\nFN:John Doe\nTEL;WORK;VOICE:(555) 555-5555\nEMAIL:[email protected]\nEND:VCARD`;
  QRCode.toDataURL(vCardData, { errorCorrectionLevel: 'H' }, function (err, url) {
    if (err) throw err;
    console.log('VCard QR Code:', url);
  });
};

generateVCardQR();

This function generates a QR code for a VCard containing the contact information of John Doe. The errorCorrectionLevel: 'H' option ensures the QR code has a high correction level, making it more resilient to damage.

Exporting QR Codes as Images

While displaying QR codes directly in web applications is common, there might be scenarios where you need to save them as image files. This section will guide you through exporting QR codes as PNG images. Append the following to your generateQR.js:

QRCode.toFile('output.png', 'https://www.digitalocean.com', function (err) {
  if (err) throw err;
  console.log('QR Code saved as image.');
});

This code snippet generates a QR code for the Digital Ocean website and saves it as a PNG file named output.png in your project directory.

Customizations and Considerations

When generating QR codes, you may want to customize their appearance or specify certain parameters like size and error correction level. The ‘qrcode’ library allows for comprehensive customization, including but not limited to:

  • Changing the QR code size
  • Adjusting the error correction level
  • Customizing the color of the QR code

Here’s an example specifying custom options:

QRCode.toDataURL('https://www.example.com', {
  color: {
    dark: '#000',  // Black dots
    light: '#FFF' // White background
  },
  margin: 4,
  width: 200
}, function (err, url) {
  if (err) throw err;
  console.log('Custom QR Code:', url);
});

Conclusion

With the steps outlined in this tutorial, you’re now equipped to generate QR codes in your Node.js applications, capable of encoding a wide array of information. As we explored, the ‘qrcode’ library not only simplifies the process but also provides extensive customization options to tailor the QR codes to your specific needs.

Remember, the applications for QR codes are endless. Whether for business, event promotions, or personal projects, incorporating QR codes can enhance user experience and streamline information sharing. Dive in and see how QR codes can benefit your next project!

Next Article: How to read a QR code image in Node.js

Previous Article: How to Write a Telegram Bot with Node.js

Series: Node.js Intermediate Tutorials

Node.js

You May Also Like

  • NestJS: How to create cursor-based pagination (2 examples)
  • Cursor-Based Pagination in SequelizeJS: Practical Examples
  • MongooseJS: Cursor-Based Pagination Examples
  • Node.js: How to get location from IP address (3 approaches)
  • SequelizeJS: How to reset auto-increment ID after deleting records
  • SequelizeJS: Grouping Results by Multiple Columns
  • NestJS: Using Faker.js to populate database (for testing)
  • NodeJS: Search and download images by keyword from Unsplash API
  • NestJS: Generate N random users using Faker.js
  • Sequelize Upsert: How to insert or update a record in one query
  • NodeJS: Declaring types when using dotenv with TypeScript
  • Using ExpressJS and Multer with TypeScript
  • NodeJS: Link to static assets (JS, CSS) in Pug templates
  • NodeJS: How to use mixins in Pug templates
  • NodeJS: Displaying images and links in Pug templates
  • ExpressJS + Pug: How to use loops to render array data
  • ExpressJS: Using MORGAN to Log HTTP Requests
  • NodeJS: Using express-fileupload to simply upload files
  • ExpressJS: How to render JSON in Pug templates