Location via proxy:   [ UP ]  
[Report a bug]   [Manage cookies]                
Scribd Logo
Upload

Welcome to Scribd!

  • 9 views

    User Authentication System

    Uploaded by

    r180652

    Copyright:

    © All Rights Reserved
    Download as PDF, TXT or read online from Scribd

    User Authentication System

    Uploaded by

    r180652
    9 views7 pages

    Copyright

    © © All Rights Reserved

    Available Formats

    PDF, TXT or read online from Scribd

    Did you find this document useful?

    Is this content inappropriate?

    Copyright:

    © All Rights Reserved
    Download as PDF, TXT or read online from Scribd
    Download as pdf or txt
    9 views7 pages

    User Authentication System

    Uploaded by

    r180652

    Copyright:

    © All Rights Reserved
    Download as PDF, TXT or read online from Scribd
    Download as pdf or txt
    of 7

    User Authentication System

    Overview:

    This project implements a simple user authentication system where users can sign up, log in, and

    access protected routes after logging in. It uses Node.js and Express.js to handle server-side logic,

    SQL to store user credentials, and JavaScript for client-side validation and interactions.

    Technologies:

    - Node.js: Backend runtime environment.

    - Express.js: Web framework for handling routes and middleware.

    - SQL: To store and manage user data.

    - JavaScript: For front-end interactions.

    Steps:

    1. Initialize the Project:

    Set up a new Node.js project:

    npm init -y

    npm install express mysql body-parser bcryptjs jsonwebtoken

    2. Set Up the Server (Express.js):

    Create an auth.js file to manage user authentication:

    const express = require('express');

    const bodyParser = require('body-parser');

    const bcrypt = require('bcryptjs');

    const jwt = require('jsonwebtoken');


    const mysql = require('mysql');

    const app = express();

    app.use(bodyParser.json());

    const secretKey = 'your_secret_key';

    // Database connection

    const db = mysql.createConnection({

    host: 'localhost',

    user: 'root',

    password: '',

    database: 'auth_db'

    });

    db.connect((err) => {

    if (err) throw err;

    console.log('Connected to the database');

    });

    // Register new users

    app.post('/register', (req, res) => {

    const { username, password } = req.body;

    const hashedPassword = bcrypt.hashSync(password, 10);

    const sql = 'INSERT INTO users (username, password) VALUES (?, ?)';

    db.query(sql, [username, hashedPassword], (err, result) => {


    if (err) throw err;

    res.send('User registered successfully');

    });

    });

    // Login users

    app.post('/login', (req, res) => {

    const { username, password } = req.body;

    const sql = 'SELECT * FROM users WHERE username = ?';

    db.query(sql, [username], (err, result) => {

    if (err) throw err;

    if (result.length === 0) return res.status(400).send('User not found');

    const user = result[0];

    const validPassword = bcrypt.compareSync(password, user.password);

    if (!validPassword) return res.status(400).send('Invalid password');

    const token = jwt.sign({ id: user.id }, secretKey, { expiresIn: '1h' });

    res.send({ token });

    });

    });

    // Protected route

    app.get('/dashboard', (req, res) => {

    const token = req.headers['authorization'];

    if (!token) return res.status(401).send('Access denied');


    jwt.verify(token, secretKey, (err, decoded) => {

    if (err) return res.status(401).send('Invalid token');

    res.send('Welcome to the dashboard');

    });

    });

    app.listen(3000, () => {

    console.log('Server running on port 3000');

    });

    3. Set Up the SQL Database:

    Create a database auth_db and a table users:

    CREATE DATABASE auth_db;

    USE auth_db;

    CREATE TABLE users (

    id INT AUTO_INCREMENT PRIMARY KEY,

    username VARCHAR(255) NOT NULL,

    password VARCHAR(255) NOT NULL

    );

    4. Frontend (HTML + JavaScript):

    Basic index.html for user registration and login:

    <!DOCTYPE html>

    <html>
    <head>

    <title>User Authentication</title>

    </head>

    <body>

    <h1>User Authentication System</h1>

    <h2>Register</h2>

    <input type="text" id="registerUsername" placeholder="Username">

    <input type="password" id="registerPassword" placeholder="Password">

    <button onclick="register()">Register</button>

    <h2>Login</h2>

    <input type="text" id="loginUsername" placeholder="Username">

    <input type="password" id="loginPassword" placeholder="Password">

    <button onclick="login()">Login</button>

    <h2>Dashboard</h2>

    <button onclick="accessDashboard()">Access Dashboard</button>

    <script>

    async function register() {

    const username = document.getElementById('registerUsername').value;

    const password = document.getElementById('registerPassword').value;

    const response = await fetch('/register', {

    method: 'POST',

    headers: { 'Content-Type': 'application/json' },


    body: JSON.stringify({ username, password })

    });

    const data = await response.text();

    alert(data);

    async function login() {

    const username = document.getElementById('loginUsername').value;

    const password = document.getElementById('loginPassword').value;

    const response = await fetch('/login', {

    method: 'POST',

    headers: { 'Content-Type': 'application/json' },

    body: JSON.stringify({ username, password })

    });

    const data = await response.json();

    localStorage.setItem('token', data.token);

    alert('Login successful');

    async function accessDashboard() {

    const token = localStorage.getItem('token');

    const response = await fetch('/dashboard', {

    headers: { 'Authorization': token }


    });

    const data = await response.text();

    alert(data);

    </script>

    </body>

    </html>

    5. Run the Project:

    Start the Node.js server:

    node auth.js

    Open the browser and visit http://localhost:3000 to interact with the user authentication system.

    You might also like