Generar un QR como data URL
Arma el valor del QR según el tipo (texto, URL, email o teléfono) y devuelve un PNG en base64.
typescript
import QRCode from "qrcode";
type QrContentType = "text" | "url" | "email" | "phone";
function buildQrValue(contentType: QrContentType, input: string): string {
const trimmed = input.trim();
if (contentType === "email") return `mailto:${trimmed}`;
if (contentType === "phone") return `tel:${trimmed.replace(/\s+/g, "")}`;
return trimmed;
}
export async function generateQrDataUrl(
contentType: QrContentType,
input: string,
size = 512,
): Promise<string> {
const value = buildQrValue(contentType, input);
return QRCode.toDataURL(value, {
errorCorrectionLevel: "M",
margin: 2,
width: size,
color: { dark: "#13202b", light: "#f3f7fa" },
});
}Dependencias
qrcodeNotas de uso
- Instalá la dependencia: npm i qrcode (y npm i -D @types/qrcode si usás TypeScript).
- El data URL se puede usar directo en el src de un <img> o convertir a Blob para descargar.
Limitaciones
- Contenidos muy largos generan QR densos y difíciles de escanear.
- Pensado para uso en navegador; en Node ajustá las opciones de salida.