QR Code

Generate QR codes as images or data URIs from your Spala flows.

QR Code

The QR Code addon generates QR code images from text, URLs, or any string data. Use it for generating shareable links, event tickets, product labels, two-factor authentication setup, and payment links.

Installation

1. Enable the QR Code addon from the Addons panel

No API keys are required. QR codes are generated through the addon; do not send sensitive secrets in QR payloads unless you have confirmed the data handling requirements for your project.

Available Steps

Generate QR Code

Creates a QR code image from the provided data.

Returns an object with the QR code image data:

{
  imageUrl: "https://api.qrserver.com/v1/create-qr-code/?data=...",
  dataUri: "data:image/png;base64,iVBORw0KGgo...",
  data: "https://myapp.com/ticket/abc123"
}

Example: Event Ticket QR Code

// POST /api/tickets/generate

// Step 1: Database Query - Create ticket record
// INSERT INTO tickets (event_id, user_id, code)
// VALUES (input.eventId, vars.auth.userId, gen_random_uuid())
// RETURNING *

// Step 2: Generate QR Code (QR Code addon)
// data: 'https://myapp.com/tickets/verify/' + vars.ticket.code
// size: 300
// Output → vars.qrCode

// Step 3: Database Query - Store QR code URL
// UPDATE tickets SET qr_code_url = vars.qrCode.imageUrl WHERE id = vars.ticket.id

// Step 4: Response
// { ticket: vars.ticket, qrCode: vars.qrCode.imageUrl }

Example: Two-Factor Authentication Setup

// POST /api/auth/2fa/setup

// Step 1: Set Variable - Generate TOTP secret
// vars.secret = generateTOTPSecret()

// Step 2: Set Variable - Build otpauth URI
// vars.otpauthUri = 'otpauth://totp/MyApp:' + vars.auth.email
//   + '?secret=' + vars.secret + '&issuer=MyApp'

// Step 3: Generate QR Code (QR Code addon)
// data: vars.otpauthUri
// size: 250
// Output → vars.qrCode

// Step 4: Database Query - Store secret (encrypted)
// UPDATE users SET totp_secret = vars.secret WHERE id = vars.auth.userId

// Step 5: Response
// { qrCodeDataUri: vars.qrCode.dataUri, secret: vars.secret }

Example: Product Label

// GET /api/products/:id/qr

// Step 1: Database Query - Get product
// SELECT * FROM products WHERE id = params.id

// Step 2: Generate QR Code (QR Code addon)
// data: 'https://mystore.com/products/' + vars.product.slug
// size: 400
// darkColor: '1a1a2e'
// lightColor: 'ffffff'
// Output → vars.qrCode

// Step 3: Response
// { productName: vars.product.name, qrCodeUrl: vars.qrCode.imageUrl }

QR codes can encode up to about 4,000 alphanumeric characters. For longer data, consider encoding a short URL that redirects to the full content.

The dataUri format embeds the entire image as a base64 string, which is useful for embedding in HTML or emails but increases the response payload size. Use imageUrl when you only need a URL reference.

The text or URL to encode in the QR code.
Image size in pixels (width and height). Default: 200.
'png' (default) or 'svg'.
Quiet zone margin in modules (default: 4).
Color of the dark modules as hex (default: '000000').
Color of the light modules as hex (default: 'ffffff').
Addons Overview
/addons
Browse available addons
Installing Addons
/addons/installing
Enable and configure addons in your project