🔒 feat: Two-Factor Authentication with Backup Codes & QR support (#5685)

* 🔒 feat: add Two-Factor Authentication (2FA) with backup codes & QR support (#5684)

* working version for generating TOTP and authenticate.

* better looking UI

* refactored + better TOTP logic

* fixed issue with UI

* fixed issue: remove initial setup when closing window before completion.

* added: onKeyDown for verify and disable

* refactored some code and cleaned it up a bit.

* refactored some code and cleaned it up a bit.

* refactored some code and cleaned it up a bit.

* refactored some code and cleaned it up a bit.

* fixed issue after updating to new main branch

* updated example

* refactored controllers

* removed `passport-totp` not used.

* update the generateBackupCodes function to generate 10 codes by default:

* update the backup codes to an object.

* fixed issue with backup codes not working

* be able to disable 2FA with backup codes.

* removed new env. replaced with JWT_SECRET

* ✨ style: improved a11y and style for TwoFactorAuthentication

* 🔒 fix: small types checks

* ✨ feat: improve 2FA UI components

* fix: remove unnecessary console log

* add option to disable 2FA with backup codes

* - add option to refresh backup codes
- (optional) maybe show the user which backup codes have already been used?

* removed text to be able to merge the main.

* removed eng tx to be able to merge

* fix: migrated lang to new format.

* feat: rewrote whole 2FA UI + refactored 2FA backend

* chore: resolving conflicts

* chore: resolving conflicts

* fix: missing packages, because of resolving conflicts.

* fix: UI issue and improved a11y

* fix: 2FA backup code not working

* fix: update localization keys for UI consistency

* fix: update button label to use localized text

* fix: refactor backup codes regeneration and update localization keys

* fix: remove outdated translation for shared links management

* fix: remove outdated 2FA code prompts from translation.json

* fix: add cursor styles for backup codes item based on usage state

* fix: resolve conflict issue

* fix: resolve conflict issue

* fix: resolve conflict issue

* fix: missing packages in package-lock.json

* fix: add disabled opacity to the verify button in TwoFactorScreen

* ⚙ fix: update 2FA logic to rely on backup codes instead of TOTP status

* ⚙️ fix: Simplify user retrieval in 2FA logic by removing unnecessary TOTP secret query

* ⚙️ test: Add unit tests for TwoFactorAuthController and twoFactorControllers

* ⚙️ fix: Ensure backup codes are validated as an array before usage in 2FA components

* ⚙️ fix: Update module path mappings in tests to use relative paths

* ⚙️ fix: Update moduleNameMapper in jest.config.js to remove the caret from path mapping

* ⚙️ refactor: Simplify import paths in TwoFactorAuthController and twoFactorControllers test files

* ⚙️ test: Mock twoFactorService methods in twoFactorControllers tests

* ⚙️ refactor: Comment out unused imports and mock setups in test files for two-factor authentication

* ⚙️ refactor: removed files

* refactor: Exclude totpSecret from user data retrieval in AuthController, LoginController, and jwtStrategy

* refactor: Consolidate backup code verification to apply DRY and remove default array in user schema

* refactor: Enhance two-factor authentication ux/flow with improved error handling and loading state management, prevent redirect to /login

---------

Co-authored-by: Marco Beretta <81851188+berry-13@users.noreply.github.com>
Co-authored-by: Danny Avila <danny@librechat.ai>

api/server/controllers/AuthController.js

@@ -61,7 +61,7 @@ const refreshController = async (req, res) => {
 
   try {
     const payload = jwt.verify(refreshToken, process.env.JWT_REFRESH_SECRET);
-    const user = await getUserById(payload.id, '-password -__v');
+    const user = await getUserById(payload.id, '-password -__v -totpSecret');
     if (!user) {
       return res.status(401).redirect('/login');
     }

api/server/controllers/TwoFactorController.js

@@ -0,0 +1,111 @@
+const {
+  verifyTOTP,
+  verifyBackupCode,
+  generateTOTPSecret,
+  generateBackupCodes,
+} = require('~/server/services/twoFactorService');
+const { updateUser, getUserById } = require('~/models');
+const { logger } = require('~/config');
+
+const enable2FAController = async (req, res) => {
+  const safeAppTitle = (process.env.APP_TITLE || 'LibreChat').replace(/\s+/g, '');
+
+  try {
+    const userId = req.user.id;
+    const secret = generateTOTPSecret();
+    const { plainCodes, codeObjects } = await generateBackupCodes();
+
+    const user = await updateUser(userId, { totpSecret: secret, backupCodes: codeObjects });
+
+    const otpauthUrl = `otpauth://totp/${safeAppTitle}:${user.email}?secret=${secret}&issuer=${safeAppTitle}`;
+
+    res.status(200).json({
+      otpauthUrl,
+      backupCodes: plainCodes,
+    });
+  } catch (err) {
+    logger.error('[enable2FAController]', err);
+    res.status(500).json({ message: err.message });
+  }
+};
+
+const verify2FAController = async (req, res) => {
+  try {
+    const userId = req.user.id;
+    const { token, backupCode } = req.body;
+    const user = await getUserById(userId);
+    if (!user || !user.totpSecret) {
+      return res.status(400).json({ message: '2FA not initiated' });
+    }
+
+    let verified = false;
+    if (token && (await verifyTOTP(user.totpSecret, token))) {
+      return res.status(200).json();
+    } else if (backupCode) {
+      verified = await verifyBackupCode({ user, backupCode });
+    }
+    if (verified) {
+      return res.status(200).json();
+    }
+
+    return res.status(400).json({ message: 'Invalid token.' });
+  } catch (err) {
+    logger.error('[verify2FAController]', err);
+    res.status(500).json({ message: err.message });
+  }
+};
+
+const confirm2FAController = async (req, res) => {
+  try {
+    const userId = req.user.id;
+    const { token } = req.body;
+    const user = await getUserById(userId);
+
+    if (!user || !user.totpSecret) {
+      return res.status(400).json({ message: '2FA not initiated' });
+    }
+
+    if (await verifyTOTP(user.totpSecret, token)) {
+      return res.status(200).json();
+    }
+
+    return res.status(400).json({ message: 'Invalid token.' });
+  } catch (err) {
+    logger.error('[confirm2FAController]', err);
+    res.status(500).json({ message: err.message });
+  }
+};
+
+const disable2FAController = async (req, res) => {
+  try {
+    const userId = req.user.id;
+    await updateUser(userId, { totpSecret: null, backupCodes: [] });
+    res.status(200).json();
+  } catch (err) {
+    logger.error('[disable2FAController]', err);
+    res.status(500).json({ message: err.message });
+  }
+};
+
+const regenerateBackupCodesController = async (req, res) => {
+  try {
+    const userId = req.user.id;
+    const { plainCodes, codeObjects } = await generateBackupCodes();
+    await updateUser(userId, { backupCodes: codeObjects });
+    res.status(200).json({
+      backupCodes: plainCodes,
+      backupCodesHash: codeObjects,
+    });
+  } catch (err) {
+    logger.error('[regenerateBackupCodesController]', err);
+    res.status(500).json({ message: err.message });
+  }
+};
+
+module.exports = {
+  enable2FAController,
+  verify2FAController,
+  confirm2FAController,
+  disable2FAController,
+  regenerateBackupCodesController,
+};

api/server/controllers/UserController.js

@@ -19,7 +19,9 @@ const { Transaction } = require('~/models/Transaction');
 const { logger } = require('~/config');
 
 const getUserController = async (req, res) => {
-  res.status(200).send(req.user);
+  const userData = req.user.toObject != null ? req.user.toObject() : { ...req.user };
+  delete userData.totpSecret;
+  res.status(200).send(userData);
 };
 
 const getTermsStatusController = async (req, res) => {

api/server/controllers/auth/LoginController.js

@@ -1,3 +1,4 @@
+const { generate2FATempToken } = require('~/server/services/twoFactorService');
 const { setAuthTokens } = require('~/server/services/AuthService');
 const { logger } = require('~/config');
 
@@ -7,7 +8,12 @@ const loginController = async (req, res) => {
       return res.status(400).json({ message: 'Invalid credentials' });
     }
 
-    const { password: _, __v, ...user } = req.user;
+    if (req.user.backupCodes != null && req.user.backupCodes.length > 0) {
+      const tempToken = generate2FATempToken(req.user._id);
+      return res.status(200).json({ twoFAPending: true, tempToken });
+    }
+
+    const { password: _p, totpSecret: _t, __v, ...user } = req.user;
     user.id = user._id.toString();
 
     const token = await setAuthTokens(req.user._id, res);

api/server/controllers/auth/TwoFactorAuthController.js

@@ -0,0 +1,56 @@
+const jwt = require('jsonwebtoken');
+const { verifyTOTP, verifyBackupCode } = require('~/server/services/twoFactorService');
+const { setAuthTokens } = require('~/server/services/AuthService');
+const { getUserById } = require('~/models/userMethods');
+const { logger } = require('~/config');
+
+const verify2FA = async (req, res) => {
+  try {
+    const { tempToken, token, backupCode } = req.body;
+    if (!tempToken) {
+      return res.status(400).json({ message: 'Missing temporary token' });
+    }
+
+    let payload;
+    try {
+      payload = jwt.verify(tempToken, process.env.JWT_SECRET);
+    } catch (err) {
+      return res.status(401).json({ message: 'Invalid or expired temporary token' });
+    }
+
+    const user = await getUserById(payload.userId);
+    // Ensure that the user exists and has backup codes (i.e. 2FA enabled)
+    if (!user || !(user.backupCodes && user.backupCodes.length > 0)) {
+      return res.status(400).json({ message: '2FA is not enabled for this user' });
+    }
+
+    let verified = false;
+
+    if (token && (await verifyTOTP(user.totpSecret, token))) {
+      verified = true;
+    } else if (backupCode) {
+      verified = await verifyBackupCode({ user, backupCode });
+    }
+
+    if (!verified) {
+      return res.status(401).json({ message: 'Invalid 2FA code or backup code' });
+    }
+
+    // Prepare user data for response.
+    // If the user is a plain object (from lean queries), we create a shallow copy.
+    const userData = user.toObject ? user.toObject() : { ...user };
+    // Remove sensitive fields
+    delete userData.password;
+    delete userData.__v;
+    delete userData.totpSecret;
+    userData.id = user._id.toString();
+
+    const authToken = await setAuthTokens(user._id, res);
+    return res.status(200).json({ token: authToken, user: userData });
+  } catch (err) {
+    logger.error('[verify2FA]', err);
+    return res.status(500).json({ message: 'Something went wrong' });
+  }
+};
+
+module.exports = { verify2FA };

api/server/routes/auth.js

@@ -7,6 +7,13 @@ const {
 } = require('~/server/controllers/AuthController');
 const { loginController } = require('~/server/controllers/auth/LoginController');
 const { logoutController } = require('~/server/controllers/auth/LogoutController');
+const { verify2FA } = require('~/server/controllers/auth/TwoFactorAuthController');
+const {
+  enable2FAController,
+  verify2FAController,
+  disable2FAController,
+  regenerateBackupCodesController, confirm2FAController,
+} = require('~/server/controllers/TwoFactorController');
 const {
   checkBan,
   loginLimiter,
@@ -50,4 +57,11 @@ router.post(
 );
 router.post('/resetPassword', checkBan, validatePasswordReset, resetPasswordController);
 
+router.get('/2fa/enable', requireJwtAuth, enable2FAController);
+router.post('/2fa/verify', requireJwtAuth, verify2FAController);
+router.post('/2fa/verify-temp', checkBan, verify2FA);
+router.post('/2fa/confirm', requireJwtAuth, confirm2FAController);
+router.post('/2fa/disable', requireJwtAuth, disable2FAController);
+router.post('/2fa/backup/regenerate', requireJwtAuth, regenerateBackupCodesController);
+
 module.exports = router;

api/server/services/twoFactorService.js

@@ -0,0 +1,205 @@
+const { sign } = require('jsonwebtoken');
+const { webcrypto } = require('node:crypto');
+const { hashBackupCode } = require('~/server/utils/crypto');
+const { updateUser } = require('~/models/userMethods');
+
+const BASE32_ALPHABET = 'ABCDEFGHIJKLMNOPQRSTUVWXYZ234567';
+
+/**
+ * Encodes a Buffer into a Base32 string using RFC 4648 alphabet.
+ * @param {Buffer} buffer - The buffer to encode.
+ * @returns {string} - The Base32 encoded string.
+ */
+const encodeBase32 = (buffer) => {
+  let bits = 0;
+  let value = 0;
+  let output = '';
+  for (const byte of buffer) {
+    value = (value << 8) | byte;
+    bits += 8;
+    while (bits >= 5) {
+      output += BASE32_ALPHABET[(value >>> (bits - 5)) & 31];
+      bits -= 5;
+    }
+  }
+  if (bits > 0) {
+    output += BASE32_ALPHABET[(value << (5 - bits)) & 31];
+  }
+  return output;
+};
+
+/**
+ * Decodes a Base32-encoded string back into a Buffer.
+ * @param {string} base32Str
+ * @returns {Buffer}
+ */
+const decodeBase32 = (base32Str) => {
+  const cleaned = base32Str.replace(/=+$/, '').toUpperCase();
+  let bits = 0;
+  let value = 0;
+  const output = [];
+  for (const char of cleaned) {
+    const idx = BASE32_ALPHABET.indexOf(char);
+    if (idx === -1) {
+      continue;
+    }
+    value = (value << 5) | idx;
+    bits += 5;
+    if (bits >= 8) {
+      output.push((value >>> (bits - 8)) & 0xff);
+      bits -= 8;
+    }
+  }
+  return Buffer.from(output);
+};
+
+/**
+ * Generate a temporary token for 2FA verification.
+ * This token is signed with JWT_SECRET and expires in 5 minutes.
+ */
+const generate2FATempToken = (userId) =>
+  sign({ userId, twoFAPending: true }, process.env.JWT_SECRET, { expiresIn: '5m' });
+
+/**
+ * Generate a TOTP secret.
+ * Generates 10 random bytes using WebCrypto and encodes them into a Base32 string.
+ */
+const generateTOTPSecret = () => {
+  const randomArray = new Uint8Array(10);
+  webcrypto.getRandomValues(randomArray);
+  return encodeBase32(Buffer.from(randomArray));
+};
+
+/**
+ * Generate a TOTP code based on the secret and current time.
+ * Uses a 30-second time step and generates a 6-digit code.
+ *
+ * @param {string} secret - Base32-encoded secret
+ * @param {number} [forTime=Date.now()] - Time in milliseconds
+ * @returns {Promise<string>} - The 6-digit TOTP code.
+ */
+const generateTOTP = async (secret, forTime = Date.now()) => {
+  const timeStep = 30; // seconds
+  const counter = Math.floor(forTime / 1000 / timeStep);
+  const counterBuffer = new ArrayBuffer(8);
+  const counterView = new DataView(counterBuffer);
+  // Write counter into the last 4 bytes (big-endian)
+  counterView.setUint32(4, counter, false);
+
+  // Decode the secret into an ArrayBuffer
+  const keyBuffer = decodeBase32(secret);
+  const keyArrayBuffer = keyBuffer.buffer.slice(
+    keyBuffer.byteOffset,
+    keyBuffer.byteOffset + keyBuffer.byteLength,
+  );
+
+  // Import the key for HMAC-SHA1 signing
+  const cryptoKey = await webcrypto.subtle.importKey(
+    'raw',
+    keyArrayBuffer,
+    { name: 'HMAC', hash: 'SHA-1' },
+    false,
+    ['sign'],
+  );
+
+  // Generate HMAC signature
+  const signatureBuffer = await webcrypto.subtle.sign('HMAC', cryptoKey, counterBuffer);
+  const hmac = new Uint8Array(signatureBuffer);
+
+  const offset = hmac[hmac.length - 1] & 0xf;
+  const slice = hmac.slice(offset, offset + 4);
+  const view = new DataView(slice.buffer, slice.byteOffset, slice.byteLength);
+  const binaryCode = view.getUint32(0, false) & 0x7fffffff;
+  const code = (binaryCode % 1000000).toString().padStart(6, '0');
+  return code;
+};
+
+/**
+ * Verify a provided TOTP token against the secret.
+ * Allows for a ±1 time-step window.
+ *
+ * @param {string} secret
+ * @param {string} token
+ * @returns {Promise<boolean>}
+ */
+const verifyTOTP = async (secret, token) => {
+  const timeStepMS = 30 * 1000;
+  const currentTime = Date.now();
+  for (let offset = -1; offset <= 1; offset++) {
+    const expected = await generateTOTP(secret, currentTime + offset * timeStepMS);
+    if (expected === token) {
+      return true;
+    }
+  }
+  return false;
+};
+
+/**
+ * Generate backup codes.
+ * Generates `count` backup code objects and returns an object with both plain codes
+ * (for one-time download) and their objects (for secure storage). Uses WebCrypto for randomness and hashing.
+ *
+ * @param {number} count - Number of backup codes to generate (default: 10).
+ * @returns {Promise<Object>} - Contains `plainCodes` (array of strings) and `codeObjects` (array of objects).
+ */
+const generateBackupCodes = async (count = 10) => {
+  const plainCodes = [];
+  const codeObjects = [];
+  const encoder = new TextEncoder();
+  for (let i = 0; i < count; i++) {
+    const randomArray = new Uint8Array(4);
+    webcrypto.getRandomValues(randomArray);
+    const code = Array.from(randomArray)
+      .map((b) => b.toString(16).padStart(2, '0'))
+      .join(''); // 8-character hex code
+    plainCodes.push(code);
+
+    // Compute SHA-256 hash of the code using WebCrypto
+    const codeBuffer = encoder.encode(code);
+    const hashBuffer = await webcrypto.subtle.digest('SHA-256', codeBuffer);
+    const hashArray = Array.from(new Uint8Array(hashBuffer));
+    const codeHash = hashArray.map((b) => b.toString(16).padStart(2, '0')).join('');
+    codeObjects.push({ codeHash, used: false, usedAt: null });
+  }
+  return { plainCodes, codeObjects };
+};
+
+/**
+ * Verifies a backup code and updates the user's backup codes if valid
+ * @param {Object} params
+ * @param {TUser | undefined} [params.user] - The user object
+ * @param {string | undefined} [params.backupCode] - The backup code to verify
+ * @returns {Promise<boolean>} - Whether the backup code was valid
+ */
+const verifyBackupCode = async ({ user, backupCode }) => {
+  if (!backupCode || !user || !Array.isArray(user.backupCodes)) {
+    return false;
+  }
+
+  const hashedInput = await hashBackupCode(backupCode.trim());
+  const matchingCode = user.backupCodes.find(
+    (codeObj) => codeObj.codeHash === hashedInput && !codeObj.used,
+  );
+
+  if (matchingCode) {
+    const updatedBackupCodes = user.backupCodes.map((codeObj) =>
+      codeObj.codeHash === hashedInput && !codeObj.used
+        ? { ...codeObj, used: true, usedAt: new Date() }
+        : codeObj,
+    );
+
+    await updateUser(user._id, { backupCodes: updatedBackupCodes });
+    return true;
+  }
+
+  return false;
+};
+
+module.exports = {
+  verifyTOTP,
+  generateTOTP,
+  verifyBackupCode,
+  generateTOTPSecret,
+  generateBackupCodes,
+  generate2FATempToken,
+};

api/server/utils/crypto.js

@@ -112,4 +112,25 @@ async function getRandomValues(length) {
   return Buffer.from(randomValues).toString('hex');
 }
 
-module.exports = { encrypt, decrypt, encryptV2, decryptV2, hashToken, getRandomValues };
+/**
+ * Computes SHA-256 hash for the given input using WebCrypto
+ * @param {string} input
+ * @returns {Promise<string>} - Hex hash string
+ */
+const hashBackupCode = async (input) => {
+  const encoder = new TextEncoder();
+  const data = encoder.encode(input);
+  const hashBuffer = await webcrypto.subtle.digest('SHA-256', data);
+  const hashArray = Array.from(new Uint8Array(hashBuffer));
+  return hashArray.map((b) => b.toString(16).padStart(2, '0')).join('');
+};
+
+module.exports = {
+  encrypt,
+  decrypt,
+  encryptV2,
+  decryptV2,
+  hashToken,
+  hashBackupCode,
+  getRandomValues,
+};