- added the function to login with email and password

- removed an unnecessary empty file
This commit is contained in:
Fabian 2025-04-26 17:08:22 +02:00
parent 4ca52e361a
commit 353087e458
4 changed files with 148 additions and 93 deletions

View File

@ -10,31 +10,60 @@
<title>Login</title>
</head>
<body>
<!-- Header -->
<div id="header-placeholder"></div>
<!-- Header -->
<div id="header-placeholder"></div>
<main class="main-content">
<main class="main-content">
<div class="login-container">
<h2 class="login-title">Login</h2>
<form class="login-form">
<div class="input-group">
<input type="text" placeholder="Username" required />
<input id="email" type="text" placeholder="E-Mail" required/>
<i class="icon fas fa-user"></i>
</div>
<div class="input-group">
<input type="password" placeholder="Passwort" required />
<input id="password" type="password" placeholder="Passwort" required/>
<i class="icon fas fa-lock"></i>
</div>
<button type="submit" class="login-btn">Login</button>
<button id="submit" type="submit" class="login-btn">Login</button>
<p class="register-text">
Noch keinen Account? <a href="/registrieren">Registrieren</a>
</p>
</form>
</div>
</main>
</main>
<!-- Fußzeiele -->
<div id="footer"></div>
<script>
document.getElementById('submit').addEventListener('click', async (event) => {
event.preventDefault()
const email = document.getElementById('email').value;
const password = document.getElementById('password').value;
try {
const response = await fetch('/api/user/login', {
method: 'POST',
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify({email, password})
})
if (response.ok) {
const data = await response.json();
alert('Login erfolgreich!');
window.location.href = '/'; // Redirect to home page after login
} else {
const errorData = await response.json()
alert('Login fehlgeschlagen: ' + (errorData.message || 'Unbekannter Fehler'))
}
} catch (error) {
console.error('Fehler beim Login: ', error)
alert('Fehler beim Senden des Logins.')
}
})
</script>
<!-- Fußzeile -->
<div id="footer"></div>
</body>
</html>

View File

@ -10,7 +10,7 @@
<title>Registrieren</title>
</head>
<body>
<div class="page-container">
<div class="page-container">
<!-- Header -->
<div id="header-placeholder"></div>
@ -39,7 +39,8 @@
</div>
<div class="input-box">
<input type="password" id="confirmPassword" name="confirmPassword" placeholder="Passwort bestätigen" required>
<input type="password" id="confirmPassword" name="confirmPassword" placeholder="Passwort bestätigen"
required>
<i class='bx bxs-lock-alt'></i>
</div>
@ -88,6 +89,6 @@
<!-- Fußzeiele -->
<div id="footer"></div>
</div>
</div>
</body>
</html>

View File

@ -3,7 +3,7 @@ const session = require('express-session');
const router = require('express').Router();
const path = require('path');
require('dotenv').config({path:'process.env'});
require('dotenv').config({path: 'process.env'});
const app = express();
const mysql = require('mysql');
@ -32,7 +32,7 @@ app.use(session({
}));
app.use(express.json());
app.use(express.urlencoded({ extended: true }));
app.use(express.urlencoded({extended: true}));
app.use(express.static(path.join(__dirname, '/scripts')));
app.use(express.static(path.join(__dirname, '/static')));
@ -127,14 +127,14 @@ app.get('/api/products/sportwagen', async (req, res) => {
});
});
app.post('/api/user/registration', (req,res)=> {
app.post('/api/user/registration', (req, res) => {
// SQL-Query für Nutzerregistration
const {name, lower_name, email, passwd} = req.body;
const sql = "INSERT INTO user (name, lower_name, email, passwd, passwd_hash_algo) VALUES (?, ?, ?, ?, 'none')"
// Query abschicken
db.query(sql, [name, lower_name, email, passwd], (err, results) => {
if (err){
if (err) {
console.error('Fehler beim Schreiben in die Datenbank: ', err);
res.status(500).send('Fehler beim Schreiben in die Datenbank');
return;
@ -143,6 +143,31 @@ app.post('/api/user/registration', (req,res)=> {
})
})
app.post('/api/user/login', (req, res) => {
const {email, password} = req.body
const sql = 'SELECT * FROM user WHERE email = ?'
db.query(sql, [email], (err, results) => {
if (err) {
console.error('Fehler beim Abrufen des Nutzers: ', err)
return res.status(500).json({message: 'Serverfehler'})
}
if (results.length === 0) {
return res.status(401).json({message: 'E-Mail nicht gefunden'})
}
const user = results[0]
if (user.passwd !== password) {
return res.status(401).json({message: 'Falsches Passwort'})
}
req.session.userId = user.id;
req.session.email = user.email;
res.json({message: 'Login erfolgreich', id: user.id})
})
})
const getIndexRoute = require('./scripts/routes/other/route-index');
app.use('/', getIndexRoute);