Wie erstelle ich eine Loginseite mit PHP?

lima-city → Forum → Programmiersprachen → PHP, MySQL & .htaccess

Autor dieses Themas
llweb-it

llweb-it hat kostenlosen Webspace.

13:37, 7.5.2024
Ich benötige eine Loginseite, welche dannach zugang zu einer seite geben soll. Man kann die seite über einen link öffnen.
Der link der seite ist http://<link>/portal/dashboard/23283923440
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

lima-city: Gratis werbefreier Webspace für deine eigene Homepage

13:44, 7.5.2024

Du könntest einen einfachen PHP script nutzen um die nutzer zu authentifizieren und anschliesend zur URL weiterzuleiten:

<?php
// Definiere eine einfache Liste von Benutzern und deren Passwörtern
$benutzerliste = array(
    'admin' => 'password',
    'jasmine' => 'Jasmine12',
    'patrick' => 'Minecraft15!'
);
 
$benutzername = isset($_POST['benutzername']) ? $_POST['benutzername'] : '';
$passwort = isset($_POST['passwort']) ? $_POST['passwort'] : '';
$fehlermeldung = '';
 
// Überprüfen Sie, ob der eingegebene Benutzername in der Benutzerliste existiert und das Passwort übereinstimmt
if (isset($benutzerliste[$benutzername]) && $benutzerliste[$benutzername] === $passwort) {
    // Anmeldedaten überprüfen, und weiterleiten zur Zielseite
    header('Location: <hier dein link>');
    exit;
} else {
    // Fehlermeldung für falsche Anmeldeinformationen
    $fehlermeldung = '
    <div class="error-container" style="background-color: rgba(255, 102, 102, 0.5); color: black; border-left: 4px solid #ff6666; padding-left: 10px;">
        <b>Anmelden fehlgeschlagen</b>
        <p>Der Benutzer existiert nicht, oder das Passwort war falsch</p>
    </div>';
}
 
// HTML-Design der Loginseite
$htmlDesign = '
<!DOCTYPE html>
<html lang="da">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <style>
        body {
            background-color: #f1f1f1;
            font-family: Arial, sans-serif;
            display: flex;
            justify-content: center;
            align-items: center;
            height: 100vh;
            margin: 0;
            padding: 0;
        }
 
        .container {
            max-width: 400px;
            margin: 0 auto;
            padding: 20px;
            background-color: #fff;
            border: 1px solid #ccc;
            border-radius: 5px;
            box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
            display: flex;
            flex-direction: column;
            align-items: center;
        }
 
        h1 {
            text-align: center;
            padding: 10px;
            border-radius: 5px;
            margin-top: 0; /* Kein oberer Abstand für den Titel */
        }
 
        h1#netlog-title {
            background-color: #003D7F;
            color: #fff;
        }
 
        .error-container {
            background-color: rgba(255, 102, 102, 0.5);
            color: black;
            border-left: 4px solid #ff6666;
            padding-left: 10px;
        }
 
        input[type="text"],
        input[type="password"],
        button {
            width: 100%;
            padding: 10px;
            margin-bottom: 10px;
            border: 1px solid #ccc;
            border-radius: 3px;
        }
 
        button {
            background-color: #007bff;
            color: #fff;
            font-weight: bold;
            cursor: pointer;
        }
 
        button:hover {
            background-color: #0056b3;
        }
    </style>
</head>
<body>
    <div class="container">
        <h1 id="netlog-title">Login</h1>
        ' . $fehlermeldung . '
        <br><p>Bitte melden sie sich mit ihren nutzerdaten an:<br><br><br><br>
 
        <form action="login.php" method="post">
            <label for="benutzername">Benutzername:</label>
            <input type="text" id="benutzername" name="benutzername" required><br><br>
 
            <label for="passwort">Passwort:</label>
            <input type="password" id="passwort" name="passwort" required><br><br>
 
            <button type="submit">Anmelden</button>
        </form>
    </div>
</body>
</html>
';
 
// Ende des HTML-Designs
echo $htmlDesign;
?>

Hierbei nennst du die datei login.php ;
Ich würde aber dringend empfehlen https zu nutzen

Autor dieses Themas
llweb-it

llweb-it hat kostenlosen Webspace.

13:50, 7.5.2024
Okay, ist es denn dann auch möglich weitere nutzer zu erstellen?
Und kann man einen Passwort zurücksetzen button einbauen?
Liebe grüße

Beitrag zuletzt geändert: 7.5.2024 13:51:12 von llweb-it
lennert-loew

lennert-loew hat kostenlosen Webspace.
13:56, 7.5.2024
Ja, du kannst weitere nutzer hinzufügen und auch nutzer löschen.
Dazu fügst / entfernst du einfach hier:
```
<?php
// Definiere eine einfache Liste von Benutzern und deren Passwörtern
$benutzerliste = array(
    'admin' => 'password',
    'jasmine' => 'Jasmine12',
    'patrick' => 'Minecraft15!'
);
```
einen nutzer.
Da die nutzer kein datenverzeichnis besitzen, kannst du sie problemlos ändern, wie du möchtest.
Ein Passwort zurücksetzen button, kannst du natürlich einbauen, dazu währe es aber besser, mysql zu nutzen.
Der gennante PHP Code ist zwar leicht sicher, wenn du jedoch auf eine seite mit sensiblen daten verweist, rate ich dringend davon ab.

sebulon

sebulon hat kostenlosen Webspace.

16:49, 13.5.2024

lennert-loew schrieb:
Du könntest einen einfachen PHP script nutzen um die nutzer zu authentifizieren und anschliesend zur URL weiterzuleiten:

<?php
// Definiere eine einfache Liste von Benutzern und deren Passwörtern
$benutzerliste = array(
    'admin' => 'password',
    'jasmine' => 'Jasmine12',
    'patrick' => 'Minecraft15!'
);
 
$benutzername = isset($_POST['benutzername']) ? $_POST['benutzername'] : '';
$passwort = isset($_POST['passwort']) ? $_POST['passwort'] : '';
$fehlermeldung = '';
 
// Überprüfen Sie, ob der eingegebene Benutzername in der Benutzerliste existiert und das Passwort übereinstimmt
if (isset($benutzerliste[$benutzername]) && $benutzerliste[$benutzername] === $passwort) {
    // Anmeldedaten überprüfen, und weiterleiten zur Zielseite
    header('Location: <hier dein link>');
    exit;
} else {
    // Fehlermeldung für falsche Anmeldeinformationen
    $fehlermeldung = '
    <div class="error-container" style="background-color: rgba(255, 102, 102, 0.5); color: black; border-left: 4px solid #ff6666; padding-left: 10px;">
        <b>Anmelden fehlgeschlagen</b>
        <p>Der Benutzer existiert nicht, oder das Passwort war falsch</p>
    </div>';
}
 
// HTML-Design der Loginseite
$htmlDesign = '
<!DOCTYPE html>
<html lang="da">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <style>
        body {
            background-color: #f1f1f1;
            font-family: Arial, sans-serif;
            display: flex;
            justify-content: center;
            align-items: center;
            height: 100vh;
            margin: 0;
            padding: 0;
        }
 
        .container {
            max-width: 400px;
            margin: 0 auto;
            padding: 20px;
            background-color: #fff;
            border: 1px solid #ccc;
            border-radius: 5px;
            box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
            display: flex;
            flex-direction: column;
            align-items: center;
        }
 
        h1 {
            text-align: center;
            padding: 10px;
            border-radius: 5px;
            margin-top: 0; /* Kein oberer Abstand für den Titel */
        }
 
        h1#netlog-title {
            background-color: #003D7F;
            color: #fff;
        }
 
        .error-container {
            background-color: rgba(255, 102, 102, 0.5);
            color: black;
            border-left: 4px solid #ff6666;
            padding-left: 10px;
        }
 
        input[type="text"],
        input[type="password"],
        button {
            width: 100%;
            padding: 10px;
            margin-bottom: 10px;
            border: 1px solid #ccc;
            border-radius: 3px;
        }
 
        button {
            background-color: #007bff;
            color: #fff;
            font-weight: bold;
            cursor: pointer;
        }
 
        button:hover {
            background-color: #0056b3;
        }
    </style>
</head>
<body>
    <div class="container">
        <h1 id="netlog-title">Login</h1>
        ' . $fehlermeldung . '
        <br><p>Bitte melden sie sich mit ihren nutzerdaten an:<br><br><br><br>
 
        <form action="login.php" method="post">
            <label for="benutzername">Benutzername:</label>
            <input type="text" id="benutzername" name="benutzername" required><br><br>
 
            <label for="passwort">Passwort:</label>
            <input type="password" id="passwort" name="passwort" required><br><br>
 
            <button type="submit">Anmelden</button>
        </form>
    </div>
</body>
</html>
';
 
// Ende des HTML-Designs
echo $htmlDesign;
?>

Hierbei nennst du die datei login.php ;
Ich würde aber dringend empfehlen https zu nutzen

Fehler Nummer 1: die Lösung oben verweist einfach nur auf einen Link, der bei Kenntnis ohne Login zugänglich ist. Hierbei kommst du besser, wenn du eine Session aufbaust, in der du prüfst, ob die Authentifizierung erfolgreich vorgenommen wurde.

Fehler Nummer 2: in dem Beispiel hast du hardcoded Passwörter in die Datei eingelesen. Wenn aus irgendwelchen Gründen der Webserver die PHP-Datei nicht interpretiert, sondern einfach nur auswirft, kann jeder alle Passwörter sehen, der zu dem Zeitpunkt zugreift.

Fehler Nummer 3: Passwörter werden nirgends nie in keiner Form Klartext hinterlegt. im primitivsten Fall gehasht und mit dem Hash gegen geprüft. das Hashen kannst du im Client vor dem Submit machen mittels JavaScript.

Potentielle Fehlerquelle Nummer 1: warum haust du das Template als String raus? man könnte normal einen Schalter einbauen zwischen eigentlicher Inhalts-Seite und Login-Seite. Macht die ganze Sache wartungsfreundlicher.

Potentielle Fehlerquelle Nummer 2: auch wenn wir nur einen Fehlerfall in diesem Konkreten Beispiel haben, würde ein konkretes Exception-Handling durchaus helfen, struktur in den code zu bringen

Potentielle Fehlerquelle Nummer 3: Modularer Aufbau des Codes. Gerade bei Anfängern ist es wichtig, sich saubere Programmierung von Anfang an anzugewöhnen. ist der Code Sauber, kann man selbst nach einer Lobotomie noch Sinnvoll mit dem Code arbeiten.

----------

Es gibt Zahlreiche Youtube-Videos, in denen das Erstellen einer PHP-Login-Seite zum Thema genommen wird. Ich denke, du kriegst da besseren Einblick dahinter, was man alles falsch machen kann.

Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

lima-city: Gratis werbefreier Webspace für deine eigene Homepage

Dir gefällt dieses Thema?

Über lima-city

lima-city bietet dir kostenlosen und werbefreien Speicherplatz für Deine Homepage. Sofort anmelden und direkt loslegen mit Webspace, PHP, Datenbanken, günstigen Domains und einer tollen Community!

kostenloser Webspace werbefrei: lima-city