Generate QR Code for OTP Enrollment

Knowledge Articles
, ,
1

Last Updated: Nov 11, 2024

Overview

This article clarifies whether it is possible to generate the QR code in the front end when implementing multifactor authentication and building a custom enrollment page for users to manage their own factors.

Applies To

  • QR Code
  • OTP Enrollment

Cause

This functionality is not yet available in Auth0, so the use of a third-party library is needed for this purpose.

Solution

When enrolling a new OTP factor, the “barcode_uri” parameter will be received in the response for the TOTP enrollment workflow.

Use the qrcode npm module (or any other library) to display it in the application. Please see node-qrcode for more details

Here is an example using qrcode:

QRCode.toCanvas(document.getElementById("verify-mfa-otp-qr"), res.barcode_uri, function (err) {
        if (err) {
            console.log("failed to draw QR code");
            console.dir(err);
        }
    })

Related References

  • Please check out this link that contains several other resources to generate a QR code from a URL.