Lab: Two-Factor Authentication (2FA)

Resources

Overview

In this lab, you’ll implement Two-Factor Authentication (2FA) for your e-commerce application using TOTP (Time-based One-Time Password).

2FA adds an extra layer of security by requiring users to provide two different authentication factors: something they know (password) and something they have (authenticator app on their phone).

What is TOTP? TOTP generates a 6-digit code that changes every 30 seconds. The code is calculated using a shared secret key and the current time. Both the server and the authenticator app (like Google Authenticator or Authy) use the same algorithm, so they generate matching codes without needing to communicate.

How 2FA Works in This Lab:

User enables 2FA by scanning a QR code with their authenticator app
The QR code contains a secret key that both the server and app will use
When logging in, after entering their password, users must also enter the 6-digit code from their app
The server verifies the code matches what it expects based on the shared secret

Real-World Applications:

Banking and financial applications
Email providers (Gmail, Outlook)
Social media platforms
Corporate VPN access
E-commerce checkout protection

Learning Objectives

By completing this lab, you will:

Implement TOTP (Time-based One-Time Password) authentication
Generate QR codes for authenticator app setup
Create middleware for 2FA verification flow
Build a “Remember this device” feature

Prerequisites

Session Middleware lab completed - You will use SessionManager for all session operations
Authentication Part 2 lab completed - You will apply middleware patterns learned there
PHP 8.2+
Smartphone with Google Authenticator, Microsoft Authenticator, or Authy app installed

Important: This lab builds on concepts from previous labs:

SessionManager (from Session lab) - All session operations use SessionManager::set(), SessionManager::get(), etc.
AuthMiddleware pattern (from Part 2) - TwoFactorMiddleware follows the same pattern

Step 1: Install Required Packages

Objective: Add the TOTP and QR code generation libraries to your project.

Open a terminal in VS Code and run the following commands:

composer require robthree/twofactorauth
composer require bacon/bacon-qr-code

What Gets Installed:

robthree/twofactorauth - TOTP generation and validation library
bacon/bacon-qr-code - QR code generation (required dependency for displaying setup QR codes)

Verify Installation: Check that both packages appear in your composer.json file under the require section.

Step 2: Import the Database Schema

Objective: Import the database schema needed for 2FA functionality using phpMyAdmin.

Open phpMyAdmin in your browser. Select your project database, click on the “SQL” tab, and execute the following SQL statements:

-- Two-factor authentication table
CREATE TABLE IF NOT EXISTS two_factor_auth (
    id INT AUTO_INCREMENT PRIMARY KEY,
    user_id INT NOT NULL,
    secret VARCHAR(255) NOT NULL,
    enabled BOOLEAN DEFAULT FALSE,
    enabled_at TIMESTAMP NULL,
    created_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP,
    updated_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP,
    FOREIGN KEY (user_id) REFERENCES users(id) ON DELETE CASCADE,
    UNIQUE KEY unique_user (user_id)
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_unicode_ci;

-- Trusted devices table for "Remember this device" feature
CREATE TABLE IF NOT EXISTS trusted_devices (
    id INT AUTO_INCREMENT PRIMARY KEY,
    user_id INT NOT NULL,
    device_token VARCHAR(255) UNIQUE NOT NULL,
    device_name VARCHAR(100),
    user_agent VARCHAR(255),
    ip_address VARCHAR(45),
    last_used_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP,
    expires_at TIMESTAMP NOT NULL,
    created_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP,
    FOREIGN KEY (user_id) REFERENCES users(id) ON DELETE CASCADE,
    INDEX idx_device_token (device_token),
    INDEX idx_user_id (user_id)
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_unicode_ci;

-- Login attempts table for rate limiting (optional - for future enhancement)
CREATE TABLE IF NOT EXISTS login_attempts (
    id INT AUTO_INCREMENT PRIMARY KEY,
    email VARCHAR(100) NOT NULL,
    ip_address VARCHAR(45) NOT NULL,
    attempted_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP,
    successful BOOLEAN DEFAULT FALSE,
    INDEX idx_email_ip (email, ip_address),
    INDEX idx_attempted_at (attempted_at)
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_unicode_ci;

Tables Created:

two_factor_auth - Stores TOTP secrets for users
trusted_devices - Stores trusted device tokens for “Remember this device” feature
login_attempts - (Optional) For implementing login rate limiting in future enhancements

Step 3: Create TwoFactorAuthModel

Objective: Create a model to manage 2FA data in the database.

Create app/Domain/Models/TwoFactorAuthModel.php:

1
<?php
2

3
declare(strict_types=1);
4

5
namespace App\Domain\Models;
6

7
/**
8
 * Model for managing Two-Factor Authentication data.
9
 */
10
class TwoFactorAuthModel extends BaseModel
11
{
12
    /**
13
     * Find 2FA record by user ID.
14
     *
15
     * @param int $userId The user's ID
16
     * @return array|null 2FA data or null if not found
17
     */
18
    public function findByUserId(int $userId): ?array
19
    {
20
        // TODO: Query the two_factor_auth table to find record by user_id
21
        // HINT: Use $this->selectOne() method from BaseModel
22
        // SQL: SELECT * FROM two_factor_auth WHERE user_id = ?
23
        // Return the result, or null if false
24

25
        return null; // Replace with your implementation
26
    }
27

28
    /**
29
     * Create a new 2FA record for a user.
30
     *
31
     * @param int $userId The user's ID
32
     * @param string $secret The TOTP secret key
33
     * @return int The ID of the created record
34
     */
35
    public function create(int $userId, string $secret): int
36
    {
37
        // TODO: Insert a new record into two_factor_auth table
38
        // HINT: Use $this->execute() for INSERT
39
        // Fields: user_id, secret, enabled (default false)
40
        // Return $this->lastInsertId()
41

42
        return 0; // Replace with your implementation
43
    }
44

45
    /**
46
     * Enable 2FA for a user.
47
     *
48
     * @param int $userId The user's ID
49
     * @return bool True if successful
50
     */
51
    public function enable(int $userId): bool
52
    {
53
        // TODO: Update the record to set enabled = true and enabled_at = NOW()
54
        // HINT: Use $this->execute() and check rowCount() > 0
55

56
        return false; // Replace with your implementation
57
    }
58

59
    /**
60
     * Disable 2FA for a user.
61
     *
62
     * @param int $userId The user's ID
63
     * @return bool True if successful
64
     */
65
    public function disable(int $userId): bool
66
    {
67
        // TODO: Update the record to set enabled = false
68
        // HINT: Use $this->execute() and check rowCount() > 0
69

70
        return false; // Replace with your implementation
71
    }
72

73
    /**
74
     * Check if user has 2FA enabled.
75
     *
76
     * @param int $userId The user's ID
77
     * @return bool True if 2FA is enabled
78
     */
79
    public function isEnabled(int $userId): bool
80
    {
81
        // TODO: Query to check if user has enabled = true
82
        // HINT: Use $this->selectOne() and check the 'enabled' field
83

84
        return false; // Replace with your implementation
85
    }
86

87
    /**
88
     * Get the secret for a user.
89
     *
90
     * @param int $userId The user's ID
91
     * @return string|null The secret or null if not found
92
     */
93
    public function getSecret(int $userId): ?string
94
    {
95
        // TODO: Get the secret field for the user
96
        // HINT: Use findByUserId() and return the 'secret' field
97

98
        return null; // Replace with your implementation
99
    }
100
}

Step 4: Create TwoFactorController

Objective: Create a controller to handle 2FA setup, verification, and disabling.

Create app/Controllers/TwoFactorController.php:

1
<?php
2

3
declare(strict_types=1);
4

5
namespace App\Controllers;
6

7
use App\Domain\Models\TwoFactorAuthModel;
8
use App\Domain\Models\UserModel;
9
use App\Helpers\FlashMessage;
10
use App\Helpers\SessionManager;
11
use RobThree\Auth\TwoFactorAuth;
12
use RobThree\Auth\Providers\Qr\BaconQrCodeProvider;
13
use Psr\Container\ContainerInterface;
14
use Psr\Http\Message\ResponseInterface as Response;
15
use Psr\Http\Message\ServerRequestInterface as Request;
16

17
/**
18
 * Controller for Two-Factor Authentication operations.
19
 */
20
class TwoFactorController extends BaseController
21
{
22

23
    public function __construct(
24
        ContainerInterface $container,
25
        private TwoFactorAuthModel $twoFactorModel,
26
        private UserModel $userModel
27
    ) {
28
        parent::__construct($container);
29
    }
30
    /**
31
     * Display the 2FA setup page with QR code.
32
     */
33
    public function showSetup(Request $request, Response $response): Response
34
    {
35
        $userId = SessionManager::get('user_id');
36
        $userEmail = SessionManager::get('user_email');
37

38
        // Check if user already has 2FA enabled
39
        if ($this->twoFactorModel->isEnabled($userId)) {
40
            FlashMessage::error('2FA is already enabled.');
41
            return $this->redirect($request, $response, 'dashboard');
42
        }
43

44
        // TODO: Create a QR code provider instance
45
        // HINT: Use BaconQrCodeProvider with parameters: (4, '#ffffff', '#000000', 'svg')
46
        // The parameters are: size, background color, foreground color, image format
47

48
        // TODO: Create a TwoFactorAuth instance
49
        // HINT: Pass the QR provider and your app name (e.g., 'YourAppName') to the constructor
50

51
        // TODO: Generate a new TOTP secret
52
        // HINT: Use the TFA instance's createSecret() method
53
        $secret = ''; // Replace with your implementation
54

55
        // Store secret in session temporarily (not in database yet)
56
        SessionManager::set('2fa_setup_secret', $secret);
57

58
        // TODO: Generate QR code as a data URI for display in an <img> tag
59
        // HINT: Use $tfa->getQRCodeImageAsDataUri($userEmail, $secret)
60
        // This returns a string like "data:image/svg+xml;base64,..." ready for img src
61
        $qrCodeDataUri = ''; // Replace with your implementation
62

63
        return $this->render($response, 'auth/2fa-setup.php', [
64
            'title' => 'Enable 2FA',
65
            'qrCodeDataUri' => $qrCodeDataUri,
66
            'secret' => $secret
67
        ]);
68
    }
69

70
    /**
71
     * Verify the code and enable 2FA.
72
     */
73
    public function verifyAndEnable(Request $request, Response $response): Response
74
    {
75
        $userId = SessionManager::get('user_id');
76
        $userEmail = SessionManager::get('user_email');
77
        $data = $request->getParsedBody();
78
        $code = $data['code'] ?? '';
79

80
        // Get secret from session
81
        $secret = SessionManager::get('2fa_setup_secret');
82

83
        if (!$secret) {
84
            FlashMessage::error('Setup session expired. Please try again.');
85
            return $this->redirect($request, $response, '2fa.setup');
86
        }
87

88
        // TODO: Create a QR code provider and TFA instance (same as showSetup)
89
        // HINT: Use BaconQrCodeProvider and TFA classes
90

91
        // TODO: Verify the user's code against the secret
92
        // HINT: Use $tfa->verifyCode($secret, $code) - returns true if valid
93
        $valid = false; // Replace with your implementation
94

95
        if (!$valid) {
96
            // TODO: Regenerate QR code for retry (user entered wrong code)
97
            // HINT: Use $tfa->getQRCodeImageAsDataUri($userEmail, $secret)
98
            $qrCodeDataUri = ''; // Replace with your implementation
99

100
            return $this->render($response, 'auth/2fa-setup.php', [
101
                'title' => 'Enable 2FA',
102
                'error' => 'Invalid verification code. Please try again.',
103
                'qrCodeDataUri' => $qrCodeDataUri,
104
                'secret' => $secret
105
            ]);
106
        }
107

108
        // TODO: Save secret to database and enable 2FA
109
        // Step 1: Create a new 2FA record: $this->twoFactorModel->create($userId, $secret)
110
        // Step 2: Enable 2FA for the user: $this->twoFactorModel->enable($userId)
111

112
        // Clear the setup secret from session
113
        SessionManager::remove('2fa_setup_secret');
114

115
        FlashMessage::success('2FA has been enabled successfully!');
116
        return $this->redirect($request, $response, 'dashboard');
117
    }
118

119
    /**
120
     * Show the 2FA verification page (during login).
121
     */
122
    public function showVerify(Request $request, Response $response): Response
123
    {
124
        return $this->render($response, 'auth/2fa-verify.php', [
125
            'title' => 'Verify 2FA'
126
        ]);
127
    }
128

129
    /**
130
     * Verify 2FA code during login.
131
     */
132
    public function verify(Request $request, Response $response): Response
133
    {
134
        $userId = SessionManager::get('user_id');
135
        $data = $request->getParsedBody();
136
        $code = $data['code'] ?? '';
137

138
        // TODO: Get the user's TOTP secret from the database
139
        // HINT: Use $this->twoFactorModel->getSecret($userId) to retrieve the secret
140
        $secret = ''; // Replace with your implementation
141

142
        // TODO: Create a TwoFactorAuth instance (QR provider not needed for verification)
143
        // HINT: new TwoFactorAuth('YourAppName')
144

145
        // TODO: Verify the user's code against their stored secret
146
        // HINT: Use $tfa->verifyCode($secret, $code)
147
        $valid = false; // Replace with your implementation
148

149
        if (!$valid) {
150
            // Track failed attempts
151
            $attempts = (SessionManager::get('2fa_attempts') ?? 0) + 1;
152
            SessionManager::set('2fa_attempts', $attempts);
153

154
            // Lockout after 5 failed attempts
155
            if ($attempts >= 5) {
156
                SessionManager::destroy();
157
                return $this->redirect($request, $response, 'auth.login');
158
            }
159

160
            return $this->render($response, 'auth/2fa-verify.php', [
161
                'title' => 'Verify 2FA',
162
                'error' => 'Invalid code. Please try again.'
163
            ]);
164
        }
165

166
        // Success! Mark 2FA as verified in session
167
        SessionManager::set('two_factor_verified', true);
168
        SessionManager::remove('2fa_attempts');
169

170
        // Regenerate session ID for security
171
        session_regenerate_id(true);
172

173
        // Redirect to dashboard
174
        return $this->redirect($request, $response, 'dashboard');
175
    }
176

177
    /**
178
     * Disable 2FA for the user.
179
     */
180
    public function disable(Request $request, Response $response): Response
181
    {
182
        $userId = SessionManager::get('user_id');
183
        $userEmail = SessionManager::get('user_email');
184
        $data = $request->getParsedBody();
185
        $password = $data['password'] ?? '';
186

187
        // Verify password before disabling 2FA
188
        $validUser = $this->userModel->verifyPassword($userEmail, $password);
189

190
        if (!$validUser) {
191
            return $this->render($response, 'auth/2fa-disable.php', [
192
                'title' => 'Disable 2FA',
193
                'error' => 'Invalid password.'
194
            ]);
195
        }
196

197
        // TODO: Disable 2FA in the database
198
        // HINT: Call $this->twoFactorModel->disable($userId)
199

200
        FlashMessage::success('2FA has been disabled.');
201
        return $this->redirect($request, $response, 'dashboard');
202
    }
203

204
    /**
205
     * Show disable confirmation page.
206
     */
207
    public function showDisable(Request $request, Response $response): Response
208
    {
209
        return $this->render($response, 'auth/2fa-disable.php', [
210
            'title' => 'Disable 2FA'
211
        ]);
212
    }
213
}

Step 5: Create TwoFactorMiddleware

Objective: Create middleware to enforce 2FA verification for authenticated users who have it enabled.

Note: This middleware follows the same pattern as AuthMiddleware from the Authentication Part 2 lab. If you need a refresher on middleware fundamentals, refer back to that lab.

This middleware runs AFTER AuthMiddleware. It checks:

Is the user authenticated?
Does the user have 2FA enabled?
Has the user already verified 2FA in this session?

If 2FA is required but not verified, the user is redirected to /2fa/verify.

Create app/Middleware/TwoFactorMiddleware.php:

1
<?php
2

3
declare(strict_types=1);
4

5
namespace App\Middleware;
6

7
use App\Domain\Models\TwoFactorAuthModel;
8
use App\Helpers\SessionManager;
9
use Psr\Http\Message\ServerRequestInterface as Request;
10
use Psr\Http\Server\RequestHandlerInterface as RequestHandler;
11
use Psr\Http\Message\ResponseInterface;
12
use Psr\Http\Server\MiddlewareInterface;
13
use Slim\Routing\RouteContext;
14

15
/**
16
 * Middleware to check if user needs to verify 2FA.
17
 *
18
 * This middleware runs AFTER AuthMiddleware. It checks:
19
 * 1. Is the user authenticated?
20
 * 2. Does the user have 2FA enabled?
21
 * 3. Has the user already verified 2FA in this session?
22
 *
23
 * If 2FA is required but not verified, redirect to /2fa/verify
24
 */
25
class TwoFactorMiddleware implements MiddlewareInterface
26
{
27
    public function __construct(private TwoFactorAuthModel $twoFactorModel)
28
    {
29
    }
30

31
    public function process(Request $request, RequestHandler $handler): ResponseInterface
32
    {
33
        // Check if user is authenticated
34
        if (!SessionManager::get('is_authenticated')) {
35
            // Not authenticated, let AuthMiddleware handle it
36
            return $handler->handle($request);
37
        }
38

39
        $userId = SessionManager::get('user_id');
40

41
        // TODO: Check if user has 2FA enabled
42
        // HINT: Use $this->twoFactorModel->isEnabled($userId)
43
        $has2FAEnabled = false; // Replace with your implementation
44

45
        // If 2FA is not enabled, proceed normally
46
        if (!$has2FAEnabled) {
47
            return $handler->handle($request);
48
        }
49

50
        // TODO: Check if 2FA has already been verified in this session
51
        // HINT: Check SessionManager::get('two_factor_verified')
52
        $isVerified = false; // Replace with: SessionManager::get('two_factor_verified')
53

54
        if ($isVerified) {
55
            // 2FA already verified, proceed
56
            return $handler->handle($request);
57
        }
58

59
        // 2FA required but not verified - redirect to verification page
60
        $routeParser = RouteContext::fromRequest($request)->getRouteParser();
61
        $verifyUrl = $routeParser->urlFor('2fa.verify');
62

63
        $response = new \Nyholm\Psr7\Response();
64
        return $response
65
            ->withStatus(302)
66
            ->withHeader('Location', $verifyUrl);
67
    }
68
}

Step 6: Create Views

Objective: Create the view templates for 2FA setup, verification, and disabling.

6.1: Create 2FA Setup View

Objective: Create the 2FA setup view to display the QR code and secret key to the user.

Create app/Views/auth/2fa-setup.php:

1
<?php require __DIR__ . '/../common/header.php'; ?>
2

3
<div class="container" style="max-width: 500px; margin: 50px auto;">
4
    <h1>Enable Two-Factor Authentication</h1>
5

6
    <?php if (isset($error)): ?>
7
        <div class="alert alert-danger"><?= htmlspecialchars($error) ?></div>
8
    <?php endif; ?>
9

10
    <div class="setup-steps">
11
        <h3>Setup Instructions:</h3>
12
        <ol>
13
            <li>Install Google Authenticator or Authy on your smartphone</li>
14
            <li>Scan the QR code below with the app</li>
15
            <li>Enter the 6-digit code from the app to verify</li>
16
        </ol>
17
    </div>
18

19
    <div class="qr-code" style="text-align: center; margin: 20px 0; background: white; padding: 20px;">
20
        <!-- QR code displays as an image using data URI -->
21
        <img src="<?= $qrCodeDataUri ?? '' ?>" alt="QR Code for 2FA Setup">
22
    </div>
23

24
    <div class="manual-entry" style="background: #f5f5f5; padding: 15px; margin: 20px 0;">
25
        <p><strong>Can't scan?</strong> Enter this code manually:</p>
26
        <code style="font-size: 1.2em; letter-spacing: 2px;"><?= htmlspecialchars($secret ?? '') ?></code>
27
    </div>
28

29
    <form method="POST" action="<?= '/' . APP_ROOT_DIR_NAME . '/2fa/verify-and-enable' ?>">
30
        <div class="form-group">
31
            <label for="code">Verification Code:</label>
32
            <input type="text"
33
                   id="code"
34
                   name="code"
35
                   pattern="[0-9]{6}"
36
                   maxlength="6"
37
                   required
38
                   autofocus
39
                   placeholder="Enter 6-digit code"
40
                   style="font-size: 1.5em; letter-spacing: 5px; text-align: center;">
41
        </div>
42

43
        <button type="submit" class="btn btn-primary">Verify and Enable 2FA</button>
44
        <a href="<?= '/' . APP_ROOT_DIR_NAME . '/dashboard' ?>" class="btn btn-secondary">Cancel</a>
45
    </form>
46
</div>
47

48
<style>
49
    .form-group { margin: 20px 0; }
50
    .form-group label { display: block; margin-bottom: 5px; }
51
    .form-group input { width: 100%; padding: 10px; border: 1px solid #ddd; border-radius: 4px; }
52
    .btn { padding: 10px 20px; border: none; border-radius: 4px; cursor: pointer; text-decoration: none; display: inline-block; margin-right: 10px; }
53
    .btn-primary { background: #007bff; color: white; }
54
    .btn-secondary { background: #6c757d; color: white; }
55
    .alert-danger { background: #f8d7da; color: #721c24; padding: 10px; border-radius: 4px; margin-bottom: 20px; }
56
</style>
57

58
<?php require __DIR__ . '/../common/footer.php'; ?>

6.2: Create 2FA Verification View

Objective: Create the 2FA verification view to verify the user’s code.

Create app/Views/auth/2fa-verify.php:

1
<?php require __DIR__ . '/../common/header.php'; ?>
2

3
<div class="container" style="max-width: 400px; margin: 100px auto;">
4
    <h1>Two-Factor Verification</h1>
5
    <p>Enter the 6-digit code from your authenticator app.</p>
6

7
    <?php if (isset($error)): ?>
8
        <div class="alert alert-danger"><?= htmlspecialchars($error) ?></div>
9
    <?php endif; ?>
10

11
    <form method="POST" action="<?= '/' . APP_ROOT_DIR_NAME . '/2fa/verify' ?>">
12
        <div class="form-group">
13
            <label for="code">Verification Code:</label>
14
            <input type="text"
15
                   id="code"
16
                   name="code"
17
                   pattern="[0-9]{6}"
18
                   maxlength="6"
19
                   required
20
                   autofocus
21
                   placeholder="000000"
22
                   style="font-size: 2em; letter-spacing: 10px; text-align: center;">
23
        </div>
24

25
        <!-- TODO: Add trust device checkbox (Part 3) -->
26
        <div class="form-group">
27
            <label>
28
                <input type="checkbox" name="trust_device" value="1">
29
                Trust this device for 30 days
30
            </label>
31
        </div>
32

33
        <button type="submit" class="btn btn-primary" style="width: 100%;">Verify</button>
34
    </form>
35

36
    <div style="margin-top: 20px; text-align: center;">
37
        <form method="POST" action="<?= '/' . APP_ROOT_DIR_NAME . '/logout' ?>">
38
            <button type="submit" class="btn-link">Cancel and Logout</button>
39
        </form>
40
    </div>
41
</div>
42

43
<style>
44
    .form-group { margin: 20px 0; }
45
    .form-group label { display: block; margin-bottom: 5px; }
46
    .form-group input[type="text"] { width: 100%; padding: 15px; border: 1px solid #ddd; border-radius: 4px; }
47
    .btn { padding: 15px 20px; border: none; border-radius: 4px; cursor: pointer; }
48
    .btn-primary { background: #007bff; color: white; }
49
    .btn-link { background: none; border: none; color: #007bff; cursor: pointer; text-decoration: underline; }
50
    .alert-danger { background: #f8d7da; color: #721c24; padding: 10px; border-radius: 4px; }
51
</style>
52

53
<?php require __DIR__ . '/../common/footer.php'; ?>

6.3: Create 2FA Disable View

Objective: Create the disable 2FA view to confirm the user’s password before disabling 2FA.

Create app/Views/auth/2fa-disable.php:

1
<?php require __DIR__ . '/../common/header.php'; ?>
2

3
<div class="container" style="max-width: 400px; margin: 100px auto;">
4
    <h1>Disable Two-Factor Authentication</h1>
5
    <p>Enter your password to confirm disabling 2FA.</p>
6

7
    <?php if (isset($error)): ?>
8
        <div class="alert alert-danger"><?= htmlspecialchars($error) ?></div>
9
    <?php endif; ?>
10

11
    <form method="POST" action="<?= '/' . APP_ROOT_DIR_NAME . '/2fa/disable' ?>">
12
        <div class="form-group">
13
            <label for="password">Password:</label>
14
            <input type="password" id="password" name="password" required>
15
        </div>
16

17
        <button type="submit" class="btn btn-danger">Disable 2FA</button>
18
        <a href="<?= '/' . APP_ROOT_DIR_NAME . '/dashboard' ?>" class="btn btn-secondary">Cancel</a>
19
    </form>
20
</div>
21

22
<style>
23
    .form-group { margin: 20px 0; }
24
    .form-group label { display: block; margin-bottom: 5px; }
25
    .form-group input { width: 100%; padding: 10px; border: 1px solid #ddd; border-radius: 4px; }
26
    .btn { padding: 10px 20px; border: none; border-radius: 4px; cursor: pointer; text-decoration: none; display: inline-block; margin-right: 10px; }
27
    .btn-danger { background: #dc3545; color: white; }
28
    .btn-secondary { background: #6c757d; color: white; }
29
    .alert-danger { background: #f8d7da; color: #721c24; padding: 10px; border-radius: 4px; }
30
</style>
31

32
<?php require __DIR__ . '/../common/footer.php'; ?>

6.4: Create the Dashboard View

Objective: Create the dashboard view to display the user’s information and security settings.

1
<?php require __DIR__ . '/../common/header.php'; ?>
2

3
<div class="container" style="max-width: 800px; margin: 50px auto;">
4
    <h1>Dashboard</h1>
5

6
    <div class="welcome-section">
7
        <h2>Welcome, <?= htmlspecialchars($_SESSION['user_first_name'] ?? 'User') ?>!</h2>
8
        <p>Email: <?= htmlspecialchars($_SESSION['user_email'] ?? '') ?></p>
9
    </div>
10

11
    <hr>
12

13
    <div class="security-section">
14
        <h3>Security Settings</h3>
15

16
        <div class="security-card">
17
            <h4>Two-Factor Authentication (2FA)</h4>
18

19
            <?php if ($has2FA): ?>
20
                <p class="status status-enabled">✓ 2FA is <strong>enabled</strong></p>
21
                <p>Your account is protected with two-factor authentication.</p>
22

23
                <form method="POST" action="<?= '/' . APP_ROOT_DIR_NAME . '/2fa/disable' ?>">
24
                    <button type="submit" class="btn btn-danger">Disable 2FA</button>
25
                </form>
26
            <?php else: ?>
27
                <p class="status status-disabled">⚠ 2FA is <strong>disabled</strong></p>
28
                <p>Enable 2FA to add an extra layer of security to your account.</p>
29

30
                <a href="<?= '/' . APP_ROOT_DIR_NAME . '/2fa/setup' ?>" class="btn btn-primary">Enable 2FA</a>
31
            <?php endif; ?>
32
        </div>
33
    </div>
34

35
    <hr>
36

37
    <div class="actions">
38
        <form method="POST" action="<?= '/' . APP_ROOT_DIR_NAME . '/logout' ?>">
39
            <button type="submit" class="btn btn-secondary">Logout</button>
40
        </form>
41
    </div>
42
</div>
43

44
<style>
45
    .welcome-section {
46
        background-color: #f8f9fa;
47
        padding: 20px;
48
        border-radius: 8px;
49
        margin-bottom: 20px;
50
    }
51

52
    .security-section {
53
        margin: 20px 0;
54
    }
55

56
    .security-card {
57
        border: 1px solid #ddd;
58
        padding: 20px;
59
        border-radius: 8px;
60
        background-color: #fff;
61
    }
62

63
    .status {
64
        padding: 10px;
65
        border-radius: 4px;
66
        margin: 10px 0;
67
    }
68

69
    .status-enabled {
70
        background-color: #d4edda;
71
        color: #155724;
72
        border: 1px solid #c3e6cb;
73
    }
74

75
    .status-disabled {
76
        background-color: #fff3cd;
77
        color: #856404;
78
        border: 1px solid #ffeaa7;
79
    }
80

81
    .btn {
82
        padding: 10px 20px;
83
        border: none;
84
        border-radius: 4px;
85
        cursor: pointer;
86
        text-decoration: none;
87
        display: inline-block;
88
    }
89

90
    .btn-primary {
91
        background-color: #007bff;
92
        color: white;
93
    }
94

95
    .btn-primary:hover {
96
        background-color: #0056b3;
97
    }
98

99
    .btn-danger {
100
        background-color: #dc3545;
101
        color: white;
102
    }
103

104
    .btn-danger:hover {
105
        background-color: #c82333;
106
    }
107

108
    .btn-secondary {
109
        background-color: #6c757d;
110
        color: white;
111
    }
112

113
    .btn-secondary:hover {
114
        background-color: #5a6268;
115
    }
116

117
    .actions {
118
        margin-top: 30px;
119
    }
120

121
    hr {
122
        margin: 30px 0;
123
        border: none;
124
        border-top: 1px solid #ddd;
125
    }
126
</style>
127

128
<?php require __DIR__ . '/../common/footer.php'; ?>

Step 7: Register Routes

Objective: Add the 2FA routes to your application.

Note: This follows the same routing and middleware syntax from Part 2. Middleware is chained using ->add() and executes in reverse order (last added runs first).

Add these routes to app/Routes/web-routes.php:

1
use App\Controllers\TwoFactorController;
2
use App\Middleware\TwoFactorMiddleware;
3

4
// 2FA Setup routes (requires auth, but not 2FA verification)
5
$app->get('/2fa/setup', [TwoFactorController::class, 'showSetup'])
6
    ->setName('2fa.setup')
7
    ->add(AuthMiddleware::class);
8

9
$app->post('/2fa/verify-and-enable', [TwoFactorController::class, 'verifyAndEnable'])
10
    ->setName('2fa.enable')
11
    ->add(AuthMiddleware::class);
12

13
// 2FA Verification during login
14
$app->get('/2fa/verify', [TwoFactorController::class, 'showVerify'])
15
    ->setName('2fa.verify')
16
    ->add(AuthMiddleware::class);
17

18
$app->post('/2fa/verify', [TwoFactorController::class, 'verify'])
19
    ->setName('2fa.verify.post')
20
    ->add(AuthMiddleware::class);
21

22
// 2FA Disable (requires full auth including 2FA)
23
$app->get('/2fa/disable', [TwoFactorController::class, 'showDisable'])
24
    ->setName('2fa.disable.show')
25
    ->add(TwoFactorMiddleware::class)
26
    ->add(AuthMiddleware::class);
27

28
$app->post('/2fa/disable', [TwoFactorController::class, 'disable'])
29
    ->setName('2fa.disable')
30
    ->add(TwoFactorMiddleware::class)
31
    ->add(AuthMiddleware::class);

Also update the dashboard route to include TwoFactorMiddleware:

1
$app->get('/dashboard', [AuthController::class, 'dashboard'])
2
    ->setName('dashboard')
3
    ->add(TwoFactorMiddleware::class)  // Add this line
4
    ->add(AuthMiddleware::class);

Objective: Modify the login process to check for 2FA status.

First, add the required import at the top of AuthController.php:

1
use App\Domain\Models\TwoFactorAuthModel;

Then update AuthController::Authenticate() - after setting session data (around line 152), update to:

1
// Check if user has 2FA enabled
2
$has2FA = $this->twoFactorModel->isEnabled($user['id']);
3

4
// Set session data using SessionManager (same pattern as Auth Part 2)
5
SessionManager::set('user_id', $user['id']);
6
SessionManager::set('user_email', $user['email']);
7
SessionManager::set('user_first_name', $user['first_name']);
8
SessionManager::set('user_last_name', $user['last_name']);
9
SessionManager::set('is_authenticated', true);
10
SessionManager::set('requires_2fa', $has2FA);
11
SessionManager::set('two_factor_verified', !$has2FA);  // Auto-verified if no 2FA

Also update the dashboard method to pass has2FA dynamically:

1
public function dashboard(Request $request, Response $response): Response
2
{
3
    $userId = SessionManager::get('user_id');
4
    $has2FA = $this->twoFactorModel->isEnabled($userId);
5

6
    return $this->render($response, 'auth/dashboard.php', [
7
        'title' => 'Dashboard',
8
        'has2FA' => $has2FA
9
    ]);
10
}

Step 9: Test 2FA

Objective: Verify that the basic 2FA functionality works correctly.

Testing Checklist:

Test Case 1: Enable 2FA

Login with a test account
Access /2fa/setup - QR code displays
Scan QR code with Google Authenticator/Authy
Enter wrong code - shows error
Enter correct code - enables 2FA successfully

Logout and login again
Redirected to /2fa/verify after password
Enter correct code - access dashboard

Test Case 3: Failed Attempts

Login and reach 2FA verification
Enter wrong code 5 times
Should be logged out and session destroyed

Test Case 4: Disable 2FA

Navigate to disable 2FA page
Enter incorrect password - shows error
Enter correct password - 2FA disabled
Next login doesn’t require 2FA

Step 10: Create TrustedDeviceModel

Objective: Create a model to manage trusted devices for the “Remember this device” feature.

This feature allows users to skip 2FA on trusted devices for 30 days.

Create app/Domain/Models/TrustedDeviceModel.php:

1
<?php
2

3
declare(strict_types=1);
4

5
namespace App\Domain\Models;
6

7
/**
8
 * Model for managing trusted devices.
9
 */
10
class TrustedDeviceModel extends BaseModel
11
{
12
    /**
13
     * Create a new trusted device record.
14
     *
15
     * @param int $userId
16
     * @param string $deviceToken
17
     * @param array $deviceInfo ['device_name', 'user_agent', 'ip_address', 'expires_at']
18
     * @return int
19
     */
20
    public function create(int $userId, string $deviceToken, array $deviceInfo): int
21
    {
22
        // TODO: Insert a new record into trusted_devices table
23
        // HINT: Use $this->execute() for INSERT
24
        // Fields: user_id, device_token, device_name, user_agent, ip_address, expires_at
25

26
        return 0; // Replace with your implementation
27
    }
28

29
    /**
30
     * Check if a device token is valid for a user.
31
     *
32
     * @param string $deviceToken
33
     * @param int $userId
34
     * @return bool True if token is valid and not expired
35
     */
36
    public function isValid(string $deviceToken, int $userId): bool
37
    {
38
        // TODO: Query to check if token exists, belongs to user, and hasn't expired
39
        // HINT: Use $this->selectOne()
40
        // SQL: SELECT * FROM trusted_devices WHERE device_token = ? AND user_id = ? AND expires_at > NOW()
41

42
        return false; // Replace with your implementation
43
    }
44

45
    /**
46
     * Update the last_used_at timestamp for a device.
47
     *
48
     * @param string $deviceToken
49
     * @return bool
50
     */
51
    public function updateLastUsed(string $deviceToken): bool
52
    {
53
        // TODO: Update last_used_at = NOW() for the device
54

55
        return false; // Replace with your implementation
56
    }
57

58
    /**
59
     * Get all trusted devices for a user.
60
     *
61
     * @param int $userId
62
     * @return array
63
     */
64
    public function getAllByUserId(int $userId): array
65
    {
66
        // TODO: Select all non-expired devices for the user
67
        // HINT: Use $this->selectAll()
68

69
        return []; // Replace with your implementation
70
    }
71

72
    /**
73
     * Revoke (delete) a specific device.
74
     *
75
     * @param int $deviceId
76
     * @param int $userId
77
     * @return bool
78
     */
79
    public function revoke(int $deviceId, int $userId): bool
80
    {
81
        // TODO: Delete the device record
82
        // IMPORTANT: Include user_id in WHERE clause for security
83

84
        return false; // Replace with your implementation
85
    }
86

87
    /**
88
     * Revoke all devices for a user.
89
     *
90
     * @param int $userId
91
     * @return bool
92
     */
93
    public function revokeAll(int $userId): bool
94
    {
95
        // TODO: Delete all trusted devices for the user
96

97
        return false; // Replace with your implementation
98
    }
99
}

Step 11: Update TwoFactorController for Device Trust

Objective: Add device trust functionality to the 2FA verification process.

First, update the TwoFactorController constructor to inject TrustedDeviceModel:

1
use App\Domain\Models\TrustedDeviceModel;
2

3
public function __construct(
4
    ContainerInterface $container,
5
    private TwoFactorAuthModel $twoFactorModel,
6
    private UserModel $userModel,
7
    private TrustedDeviceModel $trustedDeviceModel
8
) {
9
    parent::__construct($container);
10
}

Then add device trust functionality to the verify() method, after the line SessionManager::set('two_factor_verified', true);:

1
// Check if user wants to trust this device
2
$trustDevice = $data['trust_device'] ?? false;
3

4
if ($trustDevice) {
5
    // TODO: Generate a unique device token (64-character hex string)
6
    // HINT: Use bin2hex(random_bytes(32)) to generate a secure random token
7
    $deviceToken = ''; // Replace with your implementation
8

9
    // TODO: Calculate the expiration date (30 days from now)
10
    // HINT: Use DateTime class: (new \DateTime())->modify('+30 days')->format('Y-m-d H:i:s')
11
    $expiresAt = ''; // Replace with your implementation
12

13
    // TODO: Build the device information array with the following keys:
14
    // - 'device_name': Use $this->getDeviceName($request) helper method
15
    // - 'user_agent': Use $request->getHeaderLine('User-Agent')
16
    // - 'ip_address': Use $this->getClientIp($request) helper method
17
    // - 'expires_at': Use the expiration date calculated above
18
    $deviceInfo = []; // Replace with your implementation
19

20
    // TODO: Save the trusted device to the database
21
    // HINT: Call $this->trustedDeviceModel->create($userId, $deviceToken, $deviceInfo)
22

23
    // TODO: Set a secure cookie to remember this device
24
    // HINT: Use setcookie() with an options array containing:
25
    // - 'expires': strtotime('+30 days')
26
    // - 'path': '/' . APP_ROOT_DIR_NAME
27
    // - 'secure': false (set to true in production with HTTPS)
28
    // - 'httponly': true (prevents JavaScript access)
29
    // - 'samesite': 'Lax' (CSRF protection)
30
}

Add helper methods to TwoFactorController:

1
private function getDeviceName(Request $request): string
2
{
3
    $userAgent = $request->getHeaderLine('User-Agent');
4

5
    if (stripos($userAgent, 'Windows') !== false) return 'Windows PC';
6
    if (stripos($userAgent, 'Mac') !== false) return 'Mac';
7
    if (stripos($userAgent, 'iPhone') !== false) return 'iPhone';
8
    if (stripos($userAgent, 'Android') !== false) return 'Android';
9
    if (stripos($userAgent, 'Linux') !== false) return 'Linux PC';
10

11
    return 'Unknown Device';
12
}
13

14
private function getClientIp(Request $request): string
15
{
16
    $serverParams = $request->getServerParams();
17

18
    if (!empty($serverParams['HTTP_X_FORWARDED_FOR'])) {
19
        $ipList = explode(',', $serverParams['HTTP_X_FORWARDED_FOR']);
20
        return trim($ipList[0]);
21
    }
22

23
    return $serverParams['REMOTE_ADDR'] ?? '0.0.0.0';
24
}

Step 12: Update TwoFactorMiddleware for Device Trust

Objective: Check for trusted device cookie before requiring 2FA verification.

First, update the TwoFactorMiddleware constructor to inject TrustedDeviceModel:

1
use App\Domain\Models\TrustedDeviceModel;
2

3
public function __construct(
4
    private TwoFactorAuthModel $twoFactorModel,
5
    private TrustedDeviceModel $trustedDeviceModel
6
) {
7
}

Then add trusted device check in the process() method, after checking if 2FA is enabled but before redirecting to verify:

1
// Check for trusted device cookie
2
$cookies = $request->getCookieParams();
3
$deviceToken = $cookies['trusted_device'] ?? null;
4

5
if ($deviceToken) {
6
    if ($this->trustedDeviceModel->isValid($deviceToken, $userId)) {
7
        // Device is trusted - mark 2FA as verified
8
        SessionManager::set('two_factor_verified', true);
9
        $this->trustedDeviceModel->updateLastUsed($deviceToken);
10

11
        return $handler->handle($request);
12
    } else {
13
        // Token invalid/expired - delete cookie
14
        setcookie('trusted_device', '', time() - 3600, '/' . APP_ROOT_DIR_NAME);
15
    }
16
}
17

18
// Continue to redirect to 2FA verification...

Step 13: Test Remember Device Feature

Objective: Verify the trusted device functionality works correctly.

Testing Checklist:

Test Case 1: Trust a Device

Login with 2FA enabled
Check “Trust this device” checkbox
Verify 2FA code successfully
Check browser cookies - trusted_device should be set

Test Case 2: Skip 2FA on Trusted Device

Logout and login again
Should skip 2FA verification automatically
Direct access to dashboard

Test Case 3: Different Browser Still Requires 2FA

Open a different browser (or incognito mode)
Login with same account
Should still require 2FA (no cookie in new browser)

Test Case 4: Expired Token

Wait for token to expire (or manually modify database)
Login again
Should require 2FA verification

Testing Your Implementation

Functional Tests Summary

Test	Expected Result
Enable 2FA	QR code scanned, code verified, 2FA enabled
Login with 2FA	After password, redirected to /2fa/verify
Correct 2FA code	Access granted to dashboard
Wrong 2FA code	Error message, retry allowed
5 failed codes	Logged out, session destroyed
Disable 2FA	Password required, 2FA disabled
Trust device	Cookie set, skips 2FA on next login
Different browser	Still requires 2FA (no cookie)

Common Issues and Solutions

Issue 1: QR Code Not Displaying

Symptom: QR code area is blank or shows broken image

Possible Causes:

BaconQrCodeProvider not installed correctly
Secret not being generated

Solution:

Verify bacon/bacon-qr-code is installed: composer show bacon/bacon-qr-code
Check that $tfa->createSecret() is being called
Verify $tfa->getQRCodeImageAsDataUri() returns a valid data URI

Issue 2: Code Always Invalid

Symptom: Even correct codes from authenticator app are rejected

Possible Causes:

Time sync issue between server and phone
Wrong secret being used for verification

Solution:

Ensure server time is accurate (use NTP)
Verify the same secret is used for QR generation and verification
Check that the secret from session matches during setup

Issue 3: Session Secret Lost

Symptom: “Setup session expired” error during 2FA setup

Possible Causes:

Session not persisting between requests
Session cookie issues

Solution:

Verify SessionMiddleware is running
Check session configuration in PHP
Ensure cookies are enabled in browser

Issue 4: Trusted Device Not Working

Symptom: Still prompted for 2FA even after trusting device

Possible Causes:

Cookie not being set correctly
TwoFactorMiddleware not checking cookie

Solution:

Check browser cookies for trusted_device
Verify cookie path matches your app root
Check database for trusted device record

Step 14: Applying 2FA to Your Admin Panel

Objective: Integrate 2FA protection into your admin panel from Assignment 2.

Why Admin Panels Need 2FA

Admin panels have access to sensitive operations:

View and modify customer data
Manage products and pricing
Process orders and refunds
Change user permissions

If an admin account is compromised, an attacker gains full control of your e-commerce site. 2FA provides a critical second layer of protection - even if an attacker steals an admin’s password, they still can’t access the admin panel without the authenticator app.

Adding TwoFactorMiddleware to Admin Routes

In Assignment 2, you created an admin route group with AdminAuthMiddleware. Now you’ll add TwoFactorMiddleware to require 2FA verification for all admin routes.

Update your admin route group in app/Routes/web-routes.php:

1
use App\Middleware\TwoFactorMiddleware;
2
use App\Middleware\AdminAuthMiddleware;
3
use App\Middleware\AuthMiddleware;
4

5
$app->group('/admin', function ($group) {
6
    $group->get('/dashboard', [AdminController::class, 'dashboard']);
7
    $group->get('/users', [AdminController::class, 'users']);
8
    $group->get('/products', [ProductsController::class, 'index']);
9
    $group->post('/products/create', [ProductsController::class, 'createProduct']);
10
    // ... other admin routes
11
})
12
->add(TwoFactorMiddleware::class)   // Step 3: Check 2FA verified
13
->add(AdminAuthMiddleware::class)   // Step 2: Check user is admin
14
->add(AuthMiddleware::class);       // Step 1: Check user is logged in

Middleware Execution Order:

Remember that middleware executes in reverse order of the .add() calls:

Request → AuthMiddleware → AdminAuthMiddleware → TwoFactorMiddleware → Controller
              ↓                   ↓                    ↓
        "Is logged in?"    "Is user admin?"    "Is 2FA verified?"

AuthMiddleware runs first - checks if user is logged in
AdminAuthMiddleware runs second - checks if user has admin role
TwoFactorMiddleware runs third - checks if 2FA has been verified
Controller finally handles the request

Requiring 2FA for Admin Accounts

For maximum security, you can require all admin users to enable 2FA before accessing the admin panel. This ensures no admin account exists without 2FA protection.

Update your AdminAuthMiddleware to inject TwoFactorAuthModel and check if the admin has 2FA enabled:

1
<?php
2

3
declare(strict_types=1);
4

5
namespace App\Middleware;
6

7
use App\Domain\Models\TwoFactorAuthModel;
8
use App\Helpers\FlashMessage;
9
use App\Helpers\SessionManager;
10
use Psr\Http\Message\ServerRequestInterface as Request;
11
use Psr\Http\Server\RequestHandlerInterface as RequestHandler;
12
use Psr\Http\Message\ResponseInterface;
13
use Psr\Http\Server\MiddlewareInterface;
14
use Slim\Routing\RouteContext;
15

16
class AdminAuthMiddleware implements MiddlewareInterface
17
{
18
    public function __construct(
19
        private TwoFactorAuthModel $twoFactorModel
20
    ) {
21
    }
22

23
    public function process(Request $request, RequestHandler $handler): ResponseInterface
24
    {
25
        // ... existing admin role check code ...
26

27
        // After verifying the user is an admin, check if 2FA is enabled
28
        $userId = SessionManager::get('user_id');
29

30
        if (!$this->twoFactorModel->isEnabled($userId)) {
31
            // Admin must enable 2FA before accessing admin panel
32
            FlashMessage::warning('Admin accounts require Two-Factor Authentication. Please enable 2FA to continue.');
33

34
            $routeParser = RouteContext::fromRequest($request)->getRouteParser();
35
            $setupUrl = $routeParser->urlFor('2fa.setup');
36

37
            $response = new \Nyholm\Psr7\Response();
38
            return $response->withStatus(302)->withHeader('Location', $setupUrl);
39
        }
40

41
        return $handler->handle($request);
42
    }
43
}

Flow for Admin Without 2FA:

Admin logs in with password
Tries to access /admin/dashboard
AdminAuthMiddleware detects 2FA is not enabled
Redirected to /2fa/setup with a warning message
After enabling 2FA, admin can access the admin panel

Testing Checklist

Test Case	Expected Result
Admin without 2FA tries to access `/admin/dashboard`	Redirected to `/2fa/setup` with warning
Admin with 2FA enabled but not verified this session	Redirected to `/2fa/verify`
Admin with 2FA verified	Access granted to admin panel
Regular user tries to access admin route	Redirected to login or access denied
Admin with trusted device cookie	Skips 2FA verification, accesses admin panel

Files Summary

File	Status
`app/Domain/Models/TwoFactorAuthModel.php`	Create (skeleton)
`app/Domain/Models/TrustedDeviceModel.php`	Create (skeleton)
`app/Controllers/TwoFactorController.php`	Create (skeleton)
`app/Middleware/TwoFactorMiddleware.php`	Create (skeleton)
`app/Views/auth/2fa-setup.php`	Create
`app/Views/auth/2fa-verify.php`	Create
`app/Views/auth/2fa-disable.php`	Create
`app/Routes/web-routes.php`	Modify (add routes)
`config/container.php`	Modify (add dependencies)
`app/Controllers/AuthController.php`	Modify (add 2FA check)
`app/Middleware/AdminAuthMiddleware.php`	Modify (add 2FA requirement for admins - Step 14)

Test Your Understanding

What is TOTP and how does it generate codes without communicating with the server?
Why do we store the 2FA secret in the session during setup before saving it to the database?
Explain the purpose of the two_factor_verified session flag.
Why is password verification required to disable 2FA?
What happens if a user enters 5 incorrect 2FA codes?
How does the “Trust this device” feature work? What data is stored in the cookie vs. database?
Why do we regenerate the session ID after successful 2FA verification?
What is the purpose of the TwoFactorMiddleware? When does it redirect users?
Why is it important to include user_id in the WHERE clause when revoking trusted devices?
How would you add backup codes for users who lose access to their authenticator app?
What security risks exist if you don’t set httponly: true on the trusted device cookie?
Explain why the middleware order matters (AuthMiddleware before TwoFactorMiddleware).
Why should admin accounts be required to enable 2FA before accessing the admin panel?
In the admin route group, what is the execution order when you chain AuthMiddleware, AdminAuthMiddleware, and TwoFactorMiddleware?

Lab: Two-Factor Authentication (2FA)

Resources

Overview

Learning Objectives

Prerequisites

Step 1: Install Required Packages

Step 2: Import the Database Schema

Step 3: Create TwoFactorAuthModel

Step 4: Create TwoFactorController

Step 5: Create TwoFactorMiddleware

Step 6: Create Views

6.1: Create 2FA Setup View

6.2: Create 2FA Verification View

6.3: Create 2FA Disable View

6.4: Create the Dashboard View

Step 7: Register Routes

Step 8: Update Login Flow

Step 9: Test 2FA

Test Case 1: Enable 2FA

Test Case 2: Login with 2FA

Test Case 3: Failed Attempts

Test Case 4: Disable 2FA

Step 10: Create TrustedDeviceModel

Step 11: Update TwoFactorController for Device Trust

Step 12: Update TwoFactorMiddleware for Device Trust

Step 13: Test Remember Device Feature

Test Case 1: Trust a Device

Test Case 2: Skip 2FA on Trusted Device

Test Case 3: Different Browser Still Requires 2FA

Test Case 4: Expired Token

Testing Your Implementation

Functional Tests Summary

Common Issues and Solutions

Issue 1: QR Code Not Displaying

Issue 2: Code Always Invalid

Issue 3: Session Secret Lost

Issue 4: Trusted Device Not Working

Step 14: Applying 2FA to Your Admin Panel

Why Admin Panels Need 2FA

Adding TwoFactorMiddleware to Admin Routes

Requiring 2FA for Admin Accounts

Testing Checklist

Files Summary

Test Your Understanding