Mysql
 sql >> Datenbank >  >> RDS >> Mysql

Passwort-Reset-System in PHP

Ein sehr wichtiges Merkmal jeder guten Mitglieder-Website ist ein System zum Zurücksetzen des Passworts, da einige Benutzer ihr Passwort vergessen werden. In diesem Tutorial skizziere ich die Schritte, die zum Wiederherstellen des Passworts eines Benutzers erforderlich sind. Wir werden in diesem Tutorial auch ein solches System mit PHP und einer MySQL-Datenbank implementieren.

Der gesamte Prozess der Implementierung eines solchen Systems kann in drei Hauptschritte unterteilt werden. Um die Erklärung zu vereinfachen, analysieren wir diese Schritte anhand der Formulare, die wir dem Benutzer zum Ausfüllen präsentieren:

  1. Anmeldeformular:  Dieses Formular nimmt die Kombination aus Nutzername und Passwort eines Nutzers und meldet ihn an, wenn er im System registriert ist. Auf diesem Formular stellen wir einen "Passwort vergessen?" Link für den Fall, dass der Benutzer sein Passwort vergessen hat und es zurücksetzen muss.
  2. E-Mail-Formular:  Wenn der Benutzer sein Passwort vergessen hat, kann er auf die Schaltfläche „Passwort vergessen?“ klicken. Link auf der Anmeldeseite, um es zurückzusetzen. Wenn sie auf diesen Link klicken, gelangen sie zu einer anderen Seite, auf der sie aufgefordert werden, die E-Mail-Adresse einzugeben. Wenn die von ihnen angegebene E-Mail-Adresse nicht in unserer Benutzertabelle in der Datenbank enthalten ist, zeigen wir eine Fehlermeldung an, die besagt:„Kein solcher Benutzer existiert auf unserem System“. Wenn der Nutzer andererseits existiert, generieren wir ein eindeutiges Token (eine eindeutige zufällige Zeichenfolge) und speichern dieses Token zusammen mit dieser E-Mail-Adresse in der Tabelle „password_resets“ in der Datenbank. Dann senden wir ihnen eine E-Mail mit diesem Token in einem Link. Wenn sie auf den Link in der E-Mail klicken, die wir ihnen gesendet haben, werden sie auf einer Seite zu unserer Website zurückgeleitet, auf der ihnen ein anderes Formular angezeigt wird.
  3. Formular für neues Passwort:  Sobald der Benutzer wieder auf unserer Website ist, holen wir uns das Token, das aus dem Link stammt, und speichern es in einer Session-Variablen. Dann werden wir ihnen ein Formular präsentieren, das sie auffordert, ein neues Passwort für ihr Konto auf unserer Website einzugeben. Wenn das neue Passwort übermittelt wird, fragen wir die Tabelle password_resets nach dem Datensatz ab, der das Token enthält, das gerade aus dem Link in der E-Mail stammt. Wenn das Token in der Tabelle password_resets gefunden wird, sind wir sicher, dass der Benutzer der ist, der er ist, und dass er auf den Link in seiner E-Mail geklickt hat. An diesem Punkt holen wir uns jetzt die E-Mail-Adresse des Nutzers aus der Tabelle password_resets (denken Sie daran, dass wir das Token zusammen mit seiner E-Mail-Adresse gespeichert hatten) und verwenden diese E-Mail, um den Nutzer aus der Tabelle „Benutzer“ abzurufen und sein Passwort zu aktualisieren.

Hoffe das ist klar genug. Wenn nicht, bleiben Sie einfach dabei und es wird klarer, wenn wir es implementieren.

Implementierung

Erstellen Sie eine Datenbank namens password_recovery und erstellen Sie in dieser Datenbank zwei Tabellen, nämlich „users“ und „password_resets“, mit den folgenden Feldern:

Benutzer:

+----+-----------+--------------+------------+
|     field      |     type     | specs      |
+----+-----------+--------------+------------+
|  id            | INT(11)      |            |
|  username      | VARCHAR(255) |            |
|  email         | VARCHAR(255) | UNIQUE     |
|  password      | VARCHAR(255) |            |
+----------------+--------------+------------+

password_resets:

+----+-----------+--------------+------------+
|     field      |     type     | specs      |
+----+-----------+--------------+------------+
|  id            | INT(11)      |            |
|  email         | VARCHAR(255) |            |
|  token         | VARCHAR(255) | UNIQUE     |
+----------------+--------------+------------+

Hinweis: Diese Anwendung erfordert, dass der Benutzer bereits im System registriert ist. Wir werden den Teil der Benutzerregistrierung in diesem Tutorial jedoch nicht behandeln, da er bereits auf dieser Website behandelt wurde. Sie können diesem Tutorial zuerst folgen (ich empfehle es) oder nicht, aber denken Sie daran, dass wir einen Benutzer in unserer Benutzertabelle in der Datenbank haben müssen, bevor wir mit dem Zurücksetzen seines Passworts fortfahren können. Fügen Sie also auf die eine oder andere Weise einen Benutzer zu Ihrer MySQL-Datenbank hinzu. Sie können ein Tool wie PHPMyAdmin verwenden und sicherstellen, dass Sie das Passwort mit md5() verschlüsseln.

Erstellen Sie nun einen Projektordner mit dem Namen password-recovery  und stellen Sie sicher, dass sich dieser Ordner in Ihrem Serververzeichnis (htdocs-Ordner oder www-Ordner) befindet. Erstellen Sie in diesem Ordner drei Dateien, nämlich:login.php, enter_email.php, new_pass.php:

Jede dieser drei Dateien stellt die drei Schritte dar, die wir zuvor beschrieben haben. Öffnen Sie jeden von ihnen und fügen Sie die folgenden Codes ein:

login.php:

<?php include('app_logic.php'); ?>
<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Password Reset PHP</title>
	<link rel="stylesheet" href="main.css">
</head>
<body>
	<form class="login-form" action="login.php" method="post">
		<h2 class="form-title">Login</h2>
		<!-- form validation messages -->
		<?php include('messages.php'); ?>
		<div class="form-group">
			<label>Username or Email</label>
			<input type="text" value="<?php echo $user_id; ?>" name="user_id">
		</div>
		<div class="form-group">
			<label>Password</label>
			<input type="password" name="password">
		</div>
		<div class="form-group">
			<button type="submit" name="login_user" class="login-btn">Login</button>
		</div>
		<p><a href="enter_email.php">Forgot your password?</a></p>
	</form>
</body>
</html>

enter_email.php:

<?php include('app_logic.php'); ?>
<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Password Reset PHP</title>
	<link rel="stylesheet" href="main.css">
</head>
<body>
	<form class="login-form" action="enter_email.php" method="post">
		<h2 class="form-title">Reset password</h2>
		<!-- form validation messages -->
		<?php include('messages.php'); ?>
		<div class="form-group">
			<label>Your email address</label>
			<input type="email" name="email">
		</div>
		<div class="form-group">
			<button type="submit" name="reset-password" class="login-btn">Submit</button>
		</div>
	</form>
</body>
</html>

new_pass.php:

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Password Reset PHP</title>
	<link rel="stylesheet" href="main.css">
</head>
<body>
	<form class="login-form" action="new_password.php" method="post">
		<h2 class="form-title">New password</h2>
		<!-- form validation messages -->
		<?php include('messages.php'); ?>
		<div class="form-group">
			<label>New password</label>
			<input type="password" name="new_pass">
		</div>
		<div class="form-group">
			<label>Confirm new password</label>
			<input type="password" name="new_pass_c">
		</div>
		<div class="form-group">
			<button type="submit" name="new_password" class="login-btn">Submit</button>
		</div>
	</form>
</body>
</html>

In jeder dieser Dateien sehen Sie, dass wir drei Dateien enthalten, die wir noch nicht erstellt haben, nämlich app_logic.php , messages.php,file und main.css. Die erste behandelt die gesamte Logik unserer Anwendung, wie z. B. das Abfragen der Datenbank, das Senden von E-Mails an den Benutzer und mehr; die zweite zeigt dem Benutzer Rückmeldungen an, z. B. wenn er eine falsche E-Mail-Adresse eingibt, die dritte ist das Design der Anwendung.

Erstellen Sie diese Dateien im Kennwortwiederherstellungsordner. Fügen Sie in der main.css-Datei diesen Stilcode hinzu:

main.css:

body {
	background: #3b5998;
	font-size: 1.1em;
	font-family: sans-serif;
}
a {
	text-decoration: none;
}
form {
	width: 25%;
	margin: 70px auto;
	background: white;
	padding: 10px;
	border-radius: 3px;
}
h2.form-title {
	text-align: center;
}
input {
	display: block;
	box-sizing: border-box;
	width: 100%;
	padding: 8px;
}
form .form-group {
	margin: 10px auto;
}
form button {
	width: 100%;
	border: none;
	color: white;
	background: #3b5998;
	padding: 15px;
	border-radius: 5px;
}
.msg {
	margin: 5px auto;
	border-radius: 5px;
	border: 1px solid red;
	background: pink;
	text-align: left;
	color: brown;
	padding: 10px;
}

app_logic.php:

<?php 

session_start();
$errors = [];
$user_id = "";
// connect to database
$db = mysqli_connect('localhost', 'root', '', 'password-reset-php');

// LOG USER IN
if (isset($_POST['login_user'])) {
  // Get username and password from login form
  $user_id = mysqli_real_escape_string($db, $_POST['user_id']);
  $password = mysqli_real_escape_string($db, $_POST['password']);
  // validate form
  if (empty($user_id)) array_push($errors, "Username or Email is required");
  if (empty($password)) array_push($errors, "Password is required");

  // if no error in form, log user in
  if (count($errors) == 0) {
    $password = md5($password);
    $sql = "SELECT * FROM users WHERE username='$user_id' OR email='$user_id' AND password='$password'";
    $results = mysqli_query($db, $sql);

    if (mysqli_num_rows($results) == 1) {
      $_SESSION['username'] = $user_id;
      $_SESSION['success'] = "You are now logged in";
      header('location: index.php');
    }else {
      array_push($errors, "Wrong credentials");
    }
  }
}

/*
  Accept email of user whose password is to be reset
  Send email to user to reset their password
*/
if (isset($_POST['reset-password'])) {
  $email = mysqli_real_escape_string($db, $_POST['email']);
  // ensure that the user exists on our system
  $query = "SELECT email FROM users WHERE email='$email'";
  $results = mysqli_query($db, $query);

  if (empty($email)) {
    array_push($errors, "Your email is required");
  }else if(mysqli_num_rows($results) <= 0) {
    array_push($errors, "Sorry, no user exists on our system with that email");
  }
  // generate a unique random token of length 100
  $token = bin2hex(random_bytes(50));

  if (count($errors) == 0) {
    // store token in the password-reset database table against the user's email
    $sql = "INSERT INTO password_reset(email, token) VALUES ('$email', '$token')";
    $results = mysqli_query($db, $sql);

    // Send email to user with the token in a link they can click on
    $to = $email;
    $subject = "Reset your password on examplesite.com";
    $msg = "Hi there, click on this <a href=\"new_password.php?token=" . $token . "\">link</a> to reset your password on our site";
    $msg = wordwrap($msg,70);
    $headers = "From: [email protected]";
    mail($to, $subject, $msg, $headers);
    header('location: pending.php?email=' . $email);
  }
}

// ENTER A NEW PASSWORD
if (isset($_POST['new_password'])) {
  $new_pass = mysqli_real_escape_string($db, $_POST['new_pass']);
  $new_pass_c = mysqli_real_escape_string($db, $_POST['new_pass_c']);

  // Grab to token that came from the email link
  $token = $_SESSION['token'];
  if (empty($new_pass) || empty($new_pass_c)) array_push($errors, "Password is required");
  if ($new_pass !== $new_pass_c) array_push($errors, "Password do not match");
  if (count($errors) == 0) {
    // select email address of user from the password_reset table 
    $sql = "SELECT email FROM password_reset WHERE token='$token' LIMIT 1";
    $results = mysqli_query($db, $sql);
    $email = mysqli_fetch_assoc($results)['email'];

    if ($email) {
      $new_pass = md5($new_pass);
      $sql = "UPDATE users SET password='$new_pass' WHERE email='$email'";
      $results = mysqli_query($db, $sql);
      header('location: index.php');
    }
  }
}
?>

Hier sehen Sie drei Blöcke von if-Anweisungen. Diese Anweisungen verarbeiten drei Aktionen, nämlich die Nutzeranmeldung, den Erhalt einer E-Mail zum Zurücksetzen und den Erhalt eines neuen Passworts. Im zweiten Block wird der Benutzer nach Erhalt der E-Mail-Adresse des Benutzers auf eine Seite „pending.php“ umgeleitet. Diese Seite zeigt einfach eine Nachricht an, die dem Benutzer mitteilt, dass eine E-Mail an seine E-Mail-Adresse gesendet wurde, mit der er sein Passwort zurücksetzen kann.

Erstellen Sie pending.php im Stammordner unseres Projekts und fügen Sie diesen Code darin ein:

ausstehend.php:

<?php include('app_logic.php'); ?>
<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Password Reset PHP</title>
	<link rel="stylesheet" href="main.css">
</head>
<body>

	<form class="login-form" action="login.php" method="post" style="text-align: center;">
		<p>
			We sent an email to  <b><?php echo $_GET['email'] ?></b> to help you recover your account. 
		</p>
	    <p>Please login into your email account and click on the link we sent to reset your password</p>
	</form>
		
</body>
</html>

messages.php ist eine Datei, die das Code-Snippet zum Anzeigen von Fehlermeldungen im Formular enthält. Öffnen Sie es und fügen Sie diesen Code darin ein:

Nachrichten.php:

<?php  if (count($errors) > 0) : ?>
  <div class="msg">
  	<?php foreach ($errors as $error) : ?>
  	  <span><?php echo $error ?></span>
  	<?php endforeach ?>
  </div>
<?php  endif ?>

Öffnen Sie nun dieses Projekt in Ihrem Browser unter http://localhost/password-recovery/login.php und spielen Sie damit herum.

Hinweis: Wir haben die Funktion mail() von PHP verwendet, um eine E-Mail an den Benutzer zu senden. Diese Funktion kann keine E-Mails von localhost senden. Dies kann nur über einen Server erfolgen, der im Internet gehostet wird. Wir können jedoch eine Test-E-Mail-Anwendung verwenden, um das Senden von E-Mails zu simulieren, wenn Sie eine Demo auf Ihrem lokalen System haben möchten.

Schlussfolgerung

Vielen Dank, dass Sie diesem Tutorial bis zum Ende gefolgt sind. Ich hoffe, die Erklärung war klar genug und Sie haben etwas gelernt, das Ihnen bei Ihrer Webentwicklung helfen kann. Wenn Sie Probleme oder Bedenken haben, vergessen Sie nicht, diese in den Kommentaren unten zu hinterlassen, und ich werde mich bei Ihnen melden.

Ich wünsche Ihnen einen schönen Tag!