How to redirect to generated URL with ExpressJS?

08 Apr, 2021
In this article I’m showing you how to redirect users using ExpressJS. First of all, when you want to redirect the user? Here are some real scenario.
Example, when user successfully login you can redirect him to the dashboard. Another instance, when user request for reset password, generally we generate an URL with user’s old password’s hash and send to user’s email. Here, I’m showing you How redirect user to dashboard after successfully login.
Overview:
Client: Make a GET request on URL ‘/’ for login page.Server: Render login pageClient: Next, user fill the form data and make a POST request on URL ‘/login’.Server: If user data matched then redirect to ‘/dashboaard/[ USER EMAIL ]’.Client: User make GET request  on ‘/dashboaard/[ USER EMAIL ]’.Server: Render dashboard page.
Project Structure: Final project directory structure will look like this.
Project
|
|-> node_modules
|-> views
  |-> login.ejs
  |-> dashboard.ejs
|-> package.json
|-> package-lock.json
|-> server.js
Step 1: Create empty npm project folder and name it Project.
mkdir Project
cd Project 
npm init -y
Step 2: Install require dependency.
Require dependency:
ExpressJSEJSbody-parser
ExpressJS
EJS
body-parser
npm i express ejs body-parser
Step 3: Client files, the default behavior of EJS is that it looks into the ‘views’ folder for the templates to render. So, let’s make a ‘views’ folder in our main node project folder and make two files named “login.ejs”  and “dashboard.ejs” .
login.js is responsible for user login request and if login success user will redirect to dashboard.ejs.
login.ejs
<!DOCTYPE html><html><head>    <title></title>    <style type="text/css">        body{            margin: 0% auto;        }        h1{            color: green;        }        input{            margin: 10px;            display: block;            padding: 5px 10px;        }        button{            margin: 10px;            display: block;            padding: 5px 10px;            cursor: pointer;            background-color: green;            border: none;            color: white;            font-weight: bold;                    }        form{            margin: 10% auto;            padding: 20px;            width: 20%;            border: 1px solid green;        }    </style></head><body>    <form>        <center><h1>GeeksForGeeks</h1></center>          <label>Email</label>        <input type="email" id="userEmail">          <label>Password</label>        <input type="password" id="userPassword">          <button onClick = "login(event)"> Login </button>    </form>      <script>        const login = e =>{            e.preventDefault();              const email = document.getElementById('userEmail').value;            const password = document.getElementById('userPassword').value;              const option = {                headers:{                    "Content-Type": "application/json"                },                method: "POST",                body: JSON.stringify({                    email: email,                    password: password                }),                redirect: "follow"            }                              // fetching data            fetch(`<%= url %>`, option)                .then(res => res.redirected && ( location.href = res.url ))                .catch(err => alert('Something happen wrong!'));        }    </script></body></html>
dashboard.ejs
<!DOCTYPE html><html><head>    <title>Dashboard</title></head><body>    <h1>Welcome <%= email %></h1></body></html>
Step 4: Create a file name server.js on your root folder. This file is has some middleware and it response on user request. Generally user login information is fetched from database but for our case it is fair to fetch it from a damy database. 
Here, login handler route is redirect to ‘/dashboaard/[ USER EMAIL ]’ if user data matched else response with HTTP Client  Error Code 401.  
server.js
const express = require('express');const path = require('path');    const bodyParser = require('body-parser'); const ejs = require('ejs');  const app = express();const PORT = 3000;  app.set('view engine', 'ejs');app.use(bodyParser.json());  //login page routeapp.get('/', (req,res)=>{    res.render(path.join(__dirname, 'views/login.ejs'), {url: '/login'});})  // login handler routeapp.post('/login', (req,res)=>{    const {email, password} = req.body;          findUser(email, password) ?        // if user is registered        // generate a dynamic url        // redirect to user        res.redirect(301, `/dashboard/${email}`) :        res.status(401).end();  });  // dashboard routeapp.get('/dashboard/:email', (req, res)=>{    const {email} = req.params;    res.render(path.join(__dirname, 'views/dashboard.ejs'), {email: email})});  // damy user dbconst users = [    {        name: "Raktim Banerjee",        email: "raktim@email.com",        password: "Raktim"    },    {        name: "Arpita Banerjee",        email: "arpita@email.com",        password :"Arpita"    }];  // find user const findUser = (email, password)=> users.some(user =>       user.email === email && user.password === password )  // Start the serverapp.listen(PORT, err =>{    err ?     console.log("Error in server setup") :    console.log("Server listening on Port", PORT)});
Step 5: Start server.
node server.js
Output:
Express.js
NodeJS-Questions
Picked
Node.js
Web Technologies
Writing code in comment?
Please use ide.geeksforgeeks.org,
generate link and share the link here.
Installation of Node.js on Windows
JWT Authentication with Node.js
Difference between dependencies, devDependencies and peerDependencies
Mongoose Populate() Method
Mongoose find() Function
Top 10 Projects For Beginners To Practice HTML and CSS Skills
Difference between var, let and const keywords in JavaScript
How to insert spaces/tabs in text using HTML/CSS?
How to fetch data from an API in ReactJS ?
Differences between Functional Components and Class Components in React