public/registrieren/registrieren.html

@@ -18,19 +18,19 @@
     <!-- Registrierungsformular -->
     <main class="content-wrapper">
       <div class="wrapper">
-        <form action="register.php" method="POST">
+        <form id="registration Form" method="POST">
           <h1>Registrieren</h1>
 
           <div class="input-box">
-            <input type="text" name="vorname" placeholder="Vorname" required>
+            <input type="text" name="vorname" placeholder="Vorname" required id="vorname">
             <i class='bx bxs-user'></i>
           </div>
           <div class="input-box">
-            <input type="text" name="nachname" placeholder="Nachname" required>
+            <input type="text" name="nachname" placeholder="Nachname" required id="nachname">
             <i class='bx bxs-user'></i>
           </div>
           <div class="input-box">
-            <input type="email" name="email" placeholder="E-Mail" required>
+            <input type="email" name="email" placeholder="E-Mail" required id="email">
             <i class='bx bxs-envelope'></i>
           </div>
           <div class="input-box">
@@ -43,7 +43,7 @@
             <i class='bx bxs-lock-alt'></i>
           </div>
 
-          <button type="submit" class="btn">Registrieren</button>
+          <button type="submit" class="btn" id="register">Registrieren</button>
 
           <div class="register-link">
             <br>
@@ -53,6 +53,38 @@
       </div>
     </main>
 
+    <script>
+      document.getElementById('register').addEventListener('click', async (event) => {
+        event.preventDefault();
+
+        const formData = {
+          name: document.getElementById('vorname').value,
+          lower_name: document.getElementById('nachname').value,
+          email: document.getElementById('email').value,
+          passwd: document.getElementById('regPassword').value,
+        }
+
+        try {
+          const response = await fetch('/api/user/registration', {
+            method: 'POST',
+            headers: {
+              'Content-Type': 'application/json'
+            },
+            body: JSON.stringify(formData)
+          })
+          if (response.ok) {
+            const data = await response.json();
+            alert('Nutzer erfolgreich hinzugefügt! Ihre Kundennummer: ' + data.id)
+          } else {
+            alert('Fehler bei der Registrierung.')
+          }
+        } catch (error) {
+          console.error('Fehler: ', error)
+          alert('Fehler beim Senden des Formulars.')
+        }
+      })
+
+    </script>
     <!-- Fußzeiele -->
     <div id="footer"></div>
 

server.js

@@ -127,6 +127,22 @@ app.get('/api/products/sportwagen', async (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){
+            console.error('Fehler beim Schreiben in die Datenbank: ', err);
+            res.status(500).send('Fehler beim Schreiben in die Datenbank');
+            return;
+        }
+        res.status(201).json({message: 'Nutzer erfolgreich hinzugefügt', id: results.insertId})
+    })
+})
+
 const getIndexRoute = require('./scripts/routes/other/route-index');
 app.use('/', getIndexRoute);