Email verification before portal access

Implementing email verification before granting access to a portal is an essential security measure that helps ensure that users are authentic and that they have provided a valid email address. This process involves sending a verification link to the user’s email address after they register, and they must click on the link to activate their account and gain access to the portal.

Here’s a step-by-step guide to implementing email verification before portal access:

Step 1: User Registration Form

The first step is to provide a registration form on the portal where users can sign up. The form should collect basic information such as the user’s name, email, and password.

HTML (Registration Form)

<form id="registrationForm" onsubmit="registerUser(event)">
    <h3>Create an Account</h3>
    <label for="name">Full Name:</label>
    <input type="text" id="name" name="name" required>

    <label for="email">Email:</label>
    <input type="email" id="email" name="email" required>

    <label for="password">Password:</label>
    <input type="password" id="password" name="password" required>

    <button type="submit">Register</button>
</form>

Step 2: Server-Side Registration Logic

Once the user submits the registration form, you need to handle the form submission on the server side. This involves creating a new user account and sending a verification email with a unique token or verification link.

• Generate a unique verification token that is tied to the user’s account. This token will be used to verify the email address when the user clicks the verification link.
• Store the token along with the user’s registration data in the database.

Here’s a simplified backend flow:

1. The user submits the registration form.
2. The server creates the user in the database but marks the account as unverified.
3. A verification email containing a unique token is sent to the user.
4. The user must click on the verification link in the email to verify their email address.

Example Backend Logic (Node.js + Express)

const express = require('express');
const nodemailer = require('nodemailer');
const crypto = require('crypto');
const app = express();
const bodyParser = require('body-parser');

app.use(bodyParser.json());

// Assuming you have a user database and a function to store the user data.
const users = []; // Mock user database

// Create a transporter to send email via Gmail
const transporter = nodemailer.createTransport({
    service: 'gmail',
    auth: {
        user: 'your-email@gmail.com',
        pass: 'your-email-password'
    }
});

// Register route
app.post('/register', (req, res) => {
    const { name, email, password } = req.body;

    // Generate a unique token for email verification
    const verificationToken = crypto.randomBytes(20).toString('hex');
    
    // Store the user and token in the database (mocked with the array here)
    const newUser = {
        name,
        email,
        password,
        verificationToken,
        isVerified: false
    };
    users.push(newUser);

    // Create verification URL
    const verificationUrl = `http://your-portal.com/verify-email?token=${verificationToken}`;

    // Send the verification email
    const mailOptions = {
        from: 'your-email@gmail.com',
        to: email,
        subject: 'Email Verification',
        text: `Please verify your email by clicking the link: ${verificationUrl}`
    };

    transporter.sendMail(mailOptions, (error, info) => {
        if (error) {
            return res.status(500).send('Error sending email');
        }
        res.status(200).send('Registration successful, please verify your email.');
    });
});

// Verification route
app.get('/verify-email', (req, res) => {
    const { token } = req.query;

    // Find the user with the matching token
    const user = users.find(user => user.verificationToken === token);

    if (user) {
        user.isVerified = true;
        res.status(200).send('Email verified successfully. You can now access the portal.');
    } else {
        res.status(400).send('Invalid or expired verification link.');
    }
});

app.listen(3000, () => {
    console.log('Server is running on port 3000');
});

Step 3: Email Verification Link

The verification email sent to the user contains a unique verification link that the user needs to click on to verify their email address. This link contains the verification token, which is used to authenticate the user’s email address.

Example email content:

Subject: Email Verification

Hello [User's Name],

Thank you for registering on our portal. Please click the link below to verify your email address:

http://your-portal.com/verify-email?token=uniqueVerificationToken

If you did not register for an account, please ignore this email.

Best regards,
Your Portal Team

Step 4: Verifying the Token

When the user clicks on the verification link, the server should:

1. Extract the token from the URL query parameter.
2. Verify the token against the stored value in the database.
3. If the token is valid, update the user record in the database to mark their email as verified.
4. Provide feedback to the user, informing them that their email has been successfully verified and they can now log in.

Step 5: Restrict Portal Access

Until the user’s email is verified, restrict access to the portal. For example, if the user tries to log in without verifying their email, you can display a message like:

“Please verify your email before accessing the portal.”

You can implement this on the backend when a user tries to log in. If the user’s account is not verified, prevent login and prompt them to check their email for the verification link.

Example Login Check (Node.js)

app.post('/login', (req, res) => {
    const { email, password } = req.body;

    // Find the user by email
    const user = users.find(user => user.email === email);

    if (user) {
        if (!user.isVerified) {
            return res.status(400).send('Please verify your email before logging in.');
        }

        // Authenticate the user (simplified here for brevity)
        if (user.password === password) {
            res.status(200).send('Login successful');
        } else {
            res.status(400).send('Invalid credentials');
        }
    } else {
        res.status(400).send('User not found');
    }
});

Step 6: Optional – Resend Verification Email

If the user fails to verify their email within a certain timeframe, you can implement a feature that allows them to request a new verification email.

Step 7: Confirmation and Access

Once the user verifies their email, they are granted access to the portal and can proceed to use the services. They should be redirected to the login page or directly logged in after email verification.