Mysql
 sql >> Database >  >> RDS >> Mysql

Sistema di reimpostazione della password in PHP

Una caratteristica molto importante di qualsiasi buon sito Web di abbonamento è un sistema di reimpostazione della password perché alcuni utenti sono destinati a dimenticare la propria password. In questo tutorial, illustrerò i passaggi coinvolti nel recupero della password di un utente; in questo tutorial implementeremo anche un tale sistema utilizzando PHP e un database MySQL.

L'intero processo di implementazione di un tale sistema può essere suddiviso in 3 fasi principali. Per facilitare la spiegazione, analizziamo questi passaggi in termini di moduli che presenteremo all'utente da compilare:

  1. Modulo di accesso:  Questo modulo prende la combinazione di nome utente e password di un utente e lo fa accedere se è registrato sul sistema. In questo modulo forniamo un "Password dimenticata?" link nel caso in cui l'utente abbia dimenticato la password e debba reimpostarla.
  2. Modulo email:  Se l'utente ha dimenticato la password, può fare clic su "Hai dimenticato la password?" collegamento nella pagina di accesso per reimpostarlo. Se fai clic su questo link, verranno reindirizzati a un'altra pagina in cui viene chiesto loro di inserire l'email. Quando l'indirizzo e-mail che forniscono non è nella tabella dei nostri utenti nel database, visualizzeremo un messaggio di errore che dice "Nessun utente di questo tipo esiste sul nostro sistema". Se invece l'utente esiste, genereremo un token univoco (una stringa casuale univoca) e memorizzeremo questo token insieme a quell'indirizzo email nella tabella password_resets del database. Quindi invieremo loro un'e-mail con quel token in un collegamento. Quando fanno clic sul collegamento nell'e-mail che gli abbiamo inviato, verranno rimandati al nostro sito Web in una pagina che li presenta con un altro modulo.
  3. Nuova password Modulo:  Una volta che l'utente è tornato sul nostro sito Web, prenderemo il token che proviene dal collegamento e lo memorizzeremo in una variabile di sessione. Quindi presenteremo loro un modulo che chiede loro di inserire una nuova password per il loro account sul nostro sito Web. Quando viene inviata la nuova password, interrogheremo la tabella password_resets per il record che ha quel token che è appena arrivato dal collegamento nella posta. Se il token viene trovato nella tabella password_resets, allora siamo sicuri che l'utente è quello che sono e che hanno cliccato sul collegamento nella loro posta. A questo punto ora prendiamo l'e-mail dell'utente dalla tabella password_resets (ricorda che abbiamo salvato il token insieme al suo indirizzo e-mail) e ​​usiamo quell'e-mail per recuperare l'utente dalla tabella degli utenti e aggiornare la sua password.

Spero che sia abbastanza chiaro. In caso contrario, resta e diventerà più chiaro man mano che lo implementiamo.

Attuazione

Crea un database chiamato password_recovery e in quel database, crea due tabelle, ovvero users e password_resets con i seguenti campi:

utenti:

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

password_reset:

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

Nota: Questa applicazione richiede che l'utente sia già registrato nel sistema. Ma non tratteremo la parte di registrazione dell'utente in questo tutorial perché è già stata trattata su questo sito. Puoi prima seguire quel tutorial (ti consiglio di farlo) o meno, ma tieni presente che dobbiamo avere un utente nella nostra tabella utenti nel database prima di poter procedere alla reimpostazione della password. Quindi, in un modo o nell'altro, aggiungi un utente al tuo database mysql. Puoi utilizzare uno strumento come PHPMyAdmin e assicurarti di crittografare la password utilizzando md5().

Ora crea una cartella di progetto chiamata password-recovery e assicurati che questa cartella sia nella directory del tuo server (cartella htdocs o cartella www). In quella cartella, crea tre file:login.php, enter_email.php, new_pass.php:

Ciascuno di questi tre file rappresenta i tre passaggi che abbiamo delineato in precedenza. Apri ciascuno di essi e incolla i seguenti codici:

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>

inserisci_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 ciascuno di questi file, vedi che stiamo includendo tre file che non abbiamo ancora creato, vale a dire app_logic.php , messages.php,file e main.css. Il primo gestisce tutta la logica della nostra applicazione come interrogare il database, inviare email all'utente e altro; il secondo mostra messaggi di feedback all'utente, ad esempio quando inserisce un'e-mail sbagliata, il terzo è lo stile dell'applicazione.

Crea questi file nella cartella di ripristino della password. Nel file main.css, aggiungi questo codice di stile:

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');
    }
  }
}
?>

Qui vedi tre blocchi di istruzioni if. Queste istruzioni gestiscono tre azioni, ovvero l'accesso dell'utente, la ricezione dell'email di reimpostazione e la ricezione della nuova password. Nel secondo blocco, dopo aver ricevuto l'indirizzo email dell'utente, l'utente viene reindirizzato a una pagina pending.php. Questa pagina mostra semplicemente un messaggio che informa l'utente che è stata inviata un'e-mail al suo indirizzo e-mail che può utilizzare per reimpostare la password.

Crea pending.php nella cartella principale del nostro progetto e aggiungi questo codice al suo interno:

in attesa.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>

messaggi.php è un file che contiene lo snippet di codice per la visualizzazione dei messaggi di errore nel modulo. Aprilo e incolla questo codice al suo interno:

messaggi.php:

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

Ora apri questo progetto sul tuo browser all'indirizzo http://localhost/password-recovery/login.php e giocaci.

Nota: Abbiamo usato la funzione mail() di PHP per inviare e-mail all'utente. Questa funzione non può inviare e-mail da localhost. Può farlo solo utilizzando un server ospitato su Internet. Tuttavia possiamo utilizzare un'applicazione di posta di prova per simulare l'invio di e-mail se desideri avere una demo sul tuo sistema locale.

Conclusione

Grazie per aver seguito questo tutorial fino alla fine. Spero che la spiegazione sia stata abbastanza chiara e che tu abbia imparato qualcosa che può esserti d'aiuto nel tuo sviluppo web. Se hai problemi o dubbi, non dimenticare di lasciarli nei commenti qui sotto e ti risponderò.

Buona giornata!