Bird
Raised Fist0
Expressframework~5 mins

User login flow in Express

Choose your learning style10 modes available

Start learning this pattern below

Jump into concepts and practice - no test required

or
Recommended
Test this pattern10 questions across easy, medium, and hard to know if this pattern is strong
Introduction

User login flow lets people securely access their accounts on a website. It checks who they are before giving access.

When you want users to sign in to see their personal data.
When you need to protect parts of your website from strangers.
When users must enter a username and password to use your app.
When you want to keep track of who is using your service.
When you want to show different content based on who is logged in.
Syntax
Express
app.post('/login', (req, res) => {
  const { username, password } = req.body;
  // Check username and password
  if (validUser(username, password)) {
    req.session.user = username;
    res.send('Login successful');
  } else {
    res.status(401).send('Invalid credentials');
  }
});

Use app.post to handle login form submissions securely.

Access form data with req.body after using middleware like express.json() or express.urlencoded().

Examples
Simple check for fixed username and password.
Express
app.post('/login', (req, res) => {
  const { username, password } = req.body;
  if (username === 'user' && password === 'pass') {
    res.send('Welcome!');
  } else {
    res.status(401).send('Wrong login');
  }
});
Check username and password from a database asynchronously.
Express
app.post('/login', (req, res) => {
  const { username, password } = req.body;
  database.findUser(username).then(user => {
    if (user && user.password === password) {
      req.session.user = user.id;
      res.send('Logged in');
    } else {
      res.status(401).send('Invalid login');
    }
  });
});
Sample Program

This example shows a simple login flow using Express. It serves a login form, checks credentials, saves the user in session, and protects a dashboard page.

Express
import express from 'express';
import session from 'express-session';

const app = express();

app.use(express.urlencoded({ extended: true }));
app.use(session({ secret: 'secret-key', resave: false, saveUninitialized: true }));

const users = { user1: 'password123' };

app.get('/login', (req, res) => {
  res.send(`<form method='POST' action='/login'>
    <label for='username'>Username:</label>
    <input id='username' name='username' required />
    <label for='password'>Password:</label>
    <input id='password' name='password' type='password' required />
    <button type='submit'>Login</button>
  </form>`);
});

app.post('/login', (req, res) => {
  const { username, password } = req.body;
  if (users[username] && users[username] === password) {
    req.session.user = username;
    res.send(`Hello, ${username}! You are logged in.`);
  } else {
    res.status(401).send('Invalid username or password');
  }
});

app.get('/dashboard', (req, res) => {
  if (req.session.user) {
    res.send(`Welcome to your dashboard, ${req.session.user}.`);
  } else {
    res.status(401).send('Please login first');
  }
});

app.listen(3000, () => {
  console.log('Server running on http://localhost:3000');
});
OutputSuccess
Important Notes

Always use HTTPS in real apps to keep passwords safe.

Use session or tokens to remember logged-in users.

Never store plain passwords; use hashing in real projects.

Summary

User login flow checks who you are before giving access.

Use POST routes to handle login data securely.

Sessions help keep users logged in across pages.

Practice

(1/5)
1. What is the main purpose of a user login flow in an Express app?
easy
A. To verify the user's identity before granting access
B. To display the homepage content
C. To log server errors
D. To serve static files like images

Solution

  1. Step 1: Understand the login flow goal

    The login flow is designed to check who the user is by verifying credentials.
  2. Step 2: Identify the correct purpose

    Granting access only after verification matches the login flow's main purpose.
  3. Final Answer:

    To verify the user's identity before granting access -> Option A
  4. Quick Check:

    Login flow = Verify user identity [OK]
Hint: Login flow means checking user identity first [OK]
Common Mistakes:
  • Confusing login flow with serving static files
  • Thinking login flow logs errors
  • Assuming login flow shows homepage content
2. Which Express route method is best suited to securely receive login form data?
easy
A. app.put('/login', ...)
B. app.get('/login', ...)
C. app.post('/login', ...)
D. app.delete('/login', ...)

Solution

  1. Step 1: Recall HTTP methods for form data

    POST is used to send data securely from forms, unlike GET which appends data in URL.
  2. Step 2: Match method to login data handling

    Login forms should use POST to keep credentials hidden and secure.
  3. Final Answer:

    app.post('/login', ...) -> Option C
  4. Quick Check:

    Use POST for login data [OK]
Hint: Use POST to send login data securely [OK]
Common Mistakes:
  • Using GET exposes credentials in URL
  • PUT and DELETE are not for login forms
  • Confusing route methods for form submission
3. What will be the output if the following Express code is used for login and the user provides correct credentials?
app.post('/login', (req, res) => {
  const { username, password } = req.body;
  if(username === 'user' && password === 'pass') {
    req.session.user = username;
    res.send('Login successful');
  } else {
    res.status(401).send('Invalid credentials');
  }
});
medium
A. "Login successful" message sent and session user set
B. Server crashes due to missing session setup
C. "Invalid credentials" message sent always
D. Redirects to homepage without message

Solution

  1. Step 1: Analyze the login condition

    The code checks if username is 'user' and password is 'pass'. If true, it sets session user and sends success message.
  2. Step 2: Understand the output for correct credentials

    When correct, it sends 'Login successful' and stores username in session.
  3. Final Answer:

    "Login successful" message sent and session user set -> Option A
  4. Quick Check:

    Correct credentials = success message + session set [OK]
Hint: Correct login sends success and sets session [OK]
Common Mistakes:
  • Assuming server crashes without session middleware
  • Thinking invalid message shows on correct login
  • Confusing redirect with send response
4. Identify the error in this Express login route code:
app.post('/login', (req, res) => {
  const { username, password } = req.body;
  if(username == 'admin' && password == '1234') {
    res.session.user = username;
    res.send('Welcome admin');
  } else {
    res.send('Access denied');
  }
});
medium
A. Using '==' instead of '===' for comparison
B. No error, code works fine
C. Missing res.status(401) for failed login
D. Assigning session to 'res.session' instead of 'req.session'

Solution

  1. Step 1: Check session assignment

    Session data should be stored on req.session, not res.session.
  2. Step 2: Confirm correct session usage

    Using res.session will cause undefined error; req.session is correct.
  3. Final Answer:

    Assigning session to 'res.session' instead of 'req.session' -> Option D
  4. Quick Check:

    Session stored on req, not res [OK]
Hint: Session is on req, not res object [OK]
Common Mistakes:
  • Confusing req and res objects
  • Ignoring missing status code on failure
  • Thinking '==' causes error here
5. You want to keep users logged in across pages after login in Express. Which approach correctly implements this using sessions?
1. Use express-session middleware
2. On successful login, save username in req.session
3. On other routes, check if req.session.user exists
4. If exists, allow access; else redirect to login
hard
A. Sessions should not be used; use cookies only
B. This approach is correct and follows best practices
C. Store user info in res.locals instead of session
D. Use GET method to store session data

Solution

  1. Step 1: Understand session usage in Express

    express-session middleware manages sessions; storing user info in req.session keeps login state.
  2. Step 2: Verify access control logic

    Checking req.session.user on other routes to allow or redirect is standard practice.
  3. Final Answer:

    This approach is correct and follows best practices -> Option B
  4. Quick Check:

    Sessions + req.session.user check = persistent login [OK]
Hint: Use express-session and req.session.user for login persistence [OK]
Common Mistakes:
  • Thinking cookies alone handle login state securely
  • Using res.locals which resets each request
  • Trying to store session data via GET method