Avez-vous déjà créé un compte sur un site Web et devez vérifier votre courrier électronique et cliquer sur un lien de vérification envoyé par la société pour l'activer? Cela réduit considérablement le nombre de comptes spam. Dans cette leçon, nous allons apprendre à faire la même chose!
Ce didacticiel vous apprend à créer un script de vérification de courrier électronique à partir de rien. Toutefois, si vous souhaitez utiliser immédiatement quelque chose que vous pouvez utiliser sur votre site Web, consultez Email Verify sur Envato Market..
Email Verify est un script PHP qui vous permet de vérifier des adresses électroniques sans rien stocker dans aucune base de données. Il enverra aux utilisateurs un courrier électronique leur demandant de cliquer sur un lien pour vérifier leur courrier électronique avant que leur courrier électronique ne soit ajouté à celui auquel vous souhaitez l'ajouter..
Email Verify sur le marché EnvatoNous allons créer un bon script d’inscription PHP dans lequel un utilisateur peut créer un compte pour accéder à une "section membres" d’un site Web..
Une fois que l'utilisateur a créé son compte, celui-ci est verrouillé jusqu'à ce que l'utilisateur clique sur un lien de vérification qu'il recevra dans sa boîte de réception..
Nous avons d’abord besoin d’une page simple sur laquelle nos visiteurs peuvent créer leurs comptes; c'est donc la première chose que nous allons construire.
Je tiens à vous rappeler qu'il s'agit d'un didacticiel PHP et qu'à mon avis, vous devez connaître les bases du HTML avant de passer à PHP. Je vais ajouter des commentaires au HTML et CSS pour décrire chaque ligne de code.
index.php - Ceci est notre page d'inscription avec un formulaire de base.
NETTUTS> Inscrivez-vous NETTUTS> Inscrivez-vous
Formulaire d'inscription
S'il vous plaît entrez votre nom et adresse email pour créer votre compte
css / style.css - Ceci est la feuille de style pour index.php et les pages suivantes.
/ * Styles globaux * / * padding: 0; / * Réinitialise tous les bourrages à 0 * / margin: 0; / * Réinitialise toutes les marges à 0 * / body background: # F9F9F9; / * Définition de la couleur d'arrière-plan HTML * / font: 14px "Lucida Grande"; / * Définition de la taille et de la famille de la police * / color: # 464646; / * Définition de la couleur de texte globale * / p marge: 10px 0px 10px 0px; / * Ajoute un peu de rembourrage en haut et en bas de latags * / / * En-tête * / #header height: 45px; / * Définir la hauteur de l'en-tête * / background: # 464646; / * Définition de la couleur d'arrière-plan de l'en-tête * / #header h3 color: # FFFFF3; / * Définit la couleur de l'en-tête (titre en haut à gauche) * / padding: 10px; / * Définit le remplissage, pour le centrer dans l'en-tête * / font-weight: normal; / * Définit le poids de la police sur normal, par défaut, il est en gras * / / * Wrap * / #wrap background: #FFFFFF; / * Définit l’arrière-plan du contenu sur blanc * / width: 615px; / * Définit la largeur de notre zone de contenu * / margin: 0 auto; / * Centrer notre contenu dans notre navigateur * / margin-top: 50px; / * Marge en haut pour laisser un peu d'espace entre l'en-tête et le contenu * / padding: 10px; / * Rembourrage pour laisser plus de place à notre texte * / border: 1px solid #DFDFDF; / * Petite bordure pour la touche finale * / text-align: center; / * Centrer le texte de notre contenu * / #wrap h3 font: italic 22px Georgia; / * Définit la police de notre rubrique 2 qui sera affichée dans notre wrap * / / * Styles de champs de formulaire et de saisie * / form margin-top: 10px; / * Éloignez-vous davantage du texte de description * / form .submit_button background: # F9F9F9; / * Définir l’arrière-plan du bouton * / border: 1px solid #DFDFDF; / * Petite bordure autour de notre bouton d'envoi * / padding: 8px; / * Ajoute un peu plus d'espace autour du texte de notre bouton * / input font: normal 16px Georgia; / * Définir la police pour nos champs de saisie * / border: 1px solid #DFDFDF; / * Petite bordure autour de notre champ de saisie * / padding: 8px; / * Ajoute un peu plus d'espace autour de notre texte * /
Comme vous pouvez le constater, j'ai ajouté à chaque ligne un commentaire décrivant leur travail. En outre, vous avez peut-être remarqué le commentaire suivant dans le fichier index.php:
Nous allons écrire notre PHP entre ces 2 lignes!
La première chose que nous allons construire est un morceau de code qui va valider les informations. Voici une courte liste détaillant ce qui doit être fait.
Donc, notre première étape consiste à vérifier si le formulaire est soumis et si les champs ne sont pas vides.
Temps pour une panne! Nous commençons avec une instruction IF et nous validons d’abord le champ de nom:
if () // Si l'instruction est vraie, code d'exécution entre crochets isset ($ _ POST ["nom"]) // Le champ du nom est-il en cours de publication; peu importe qu'il soit vide ou rempli. && // C’est la même chose que AND dans notre déclaration; cela vous permet de vérifier plusieurs déclarations. ! empty ($ _ POST ['name']) // Vérifie si le nom du champ n'est pas vide isset ($ _ POST ['email']) // Le champ email est-il en cours de publication; peu importe si c'est vide ou rempli. && // C’est la même chose que AND dans notre déclaration; cela vous permet de vérifier plusieurs déclarations. ! empty ($ _ POST ['email']) // Vérifie si le champ email n'est pas vide
Donc, si vous soumettez le formulaire maintenant avec des champs vides, rien ne se passe. Si vous remplissez les deux champs, notre script exécutera le code entre les crochets..
Nous allons maintenant créer un morceau de code qui vérifiera si une adresse email est valide. Si ce n'est pas le cas, nous renverrons une erreur. Aussi, transformons nos variables de post en variables locales:
if (isset ($ _ POST ['name']) &&! empty ($ _ POST ['name']) ET isset ($ _ POST ['email']) &&! empty ($ _ POST ['email'])) $ name = mysql_escape_string ($ _ POST ['name']); // Transforme notre publication en une variable locale $ email = mysql_escape_string ($ _ POST ['email']); // Transforme notre publication en une variable locale
Nous pouvons maintenant accéder à nos données via nos variables locales. Comme vous pouvez le constater, j'ai également ajouté une chaîne d'échappement MySQL pour empêcher l'injection de MySQL lors de l'insertion des données dans la base de données MySQL..
"La fonction mysql_real_escape_string () échappe aux caractères spéciaux d'une chaîne pour les utiliser dans une instruction SQL."
La prochaine étape est un petit extrait qui vérifie si l'adresse e-mail est valide.
$ name = mysql_escape_string ($ _ POST ['name']); $ email = mysql_escape_string ($ _ POST ['email']); if (! eregi ("^ [_ a-z0-9 -] + (\. [_ a-z0-9 -] +) * @ [a-z0-9 -] + (\. [a-z0-9- ] +) * (\. [az] 2,3) $ ", $ email)) // Erreur de retour - Email invalide else // Retour de succès - Email valide
Veuillez noter que je n'ai pas personnellement écrit cette expression régulière, c'est un petit extrait de php.net.
Fondamentalement, il vérifie si le courrier électronique est écrit au format suivant:
[email protected]
Maintenant dans l'eregi, vous pouvez voir qu'il vérifie si l'e-mail contient des caractères de l'alphabet, s'il comporte des chiffres ou un tiret fantôme (_), et bien sûr les exigences de base pour un e-mail (email) '@' et un point)'.' Si aucun de ces caractères n'est trouvé, l'expression renvoie "false". Bon, il faut maintenant ajouter quelques messages d'erreur de base.
if (! eregi ("^ [_ a-z0-9 -] + (\. [_ a-z0-9 -] +) * @ [a-z0-9 -] + (\. [a-z0-9- ] +) * (\. [az] 2,3) $ ", $ email)) // Erreur de retour - Email invalide $ msg = 'Le courriel que vous avez entré est invalide, veuillez réessayer.'; else // Return Success - Email valide $ msg = 'Votre compte a été créé,
veuillez le vérifier en cliquant sur le lien d'activation qui a été envoyé à votre adresse électronique. ';
Comme vous pouvez le constater, nous avons créé une variable locale "$ msg", ce qui nous permet d'afficher l'erreur ou le message de réussite n'importe où sur la page..
Et nous allons l'afficher entre le texte d'instruction et le formulaire.
Formulaire d'inscription
Veuillez entrer votre nom et votre adresse email pour créer votre compte.
'. $ msg.'
Ajouter ceci à style.css, styler un peu notre message d'état.
#wrap .statusmsg taille de la police: 12px; / * Définir la taille de la police du message * / padding: 3px; / * Quelques marges intérieures pour laisser plus de place à notre texte * / background: #EDEDED; / * Ajoute une couleur de fond à notre message d'état * / border: 1px solid #DFDFDF; / * Ajouter une bordure autour de notre message d'état * /
Nous devons maintenant établir une connexion à la base de données et créer une table pour insérer les données du compte. Passons donc à PHPMyAdmin et créons une nouvelle base de données avec le nom inscriptions et créer un compte utilisateur ayant accès à cette base de données pour insérer et mettre à jour des données.
Créons notre utilisateurs table, avec 5 champs:
Alors maintenant, nous devons entrer les détails pour ces champs:
Pour ceux qui ne veulent pas saisir ces données manuellement, vous pouvez exécuter le code SQL suivant.
CREATE TABLE 'utilisateurs' ('id' INT (10) NON NUL AUTO_INCREMENT, clé '' nom d'utilisateur 'VARCHAR (32) NON NULL,' mot de passe 'VARCHAR (32) NON NULL,' email 'TEXT NON NULL,' hash 'VARCHAR (32) NOT NULL, 'actif' INT (1) NON NULL PAR DÉFAUT '0') ENGINE = MYISAM;
Notre base de données est créée, nous devons maintenant établir une connexion en utilisant PHP. Nous écrirons le code suivant au début de notre script juste en dessous de la ligne suivante:
Nous allons utiliser le code suivant pour vous connecter au serveur de base de données et sélectionner le inscriptions base de données. (connexion MySQL de base)
mysql_connect ("localhost", "nom d'utilisateur", "mot de passe") ou die (mysql_error ()); // Connectez-vous au serveur de base de données (localhost) avec un nom d'utilisateur et un mot de passe. mysql_select_db ("registrations") ou die (mysql_error ()); // Sélection de la base de données des inscriptions.Maintenant que nous avons établi une connexion avec notre base de données, nous pouvons passer à l'étape suivante et insérer les détails du compte..
Étape 4 - Insérer un compte
Il est maintenant temps d'entrer les détails du compte soumis dans notre base de données et de générer un hachage d'activation. Écrivez le code suivant sous cette ligne:
// Return Success - Email valide $ msg = 'Votre compte a été créé,
veuillez le vérifier en cliquant sur le lien d'activation qui a été envoyé à votre adresse électronique. ';Activation du hachage
Dans notre base de données, nous avons créé un champ appelé hash, ce hachage est une chaîne de texte de 32 caractères. Nous envoyons également ce code à l'adresse électronique de l'utilisateur. Ils peuvent ensuite cliquer sur le lien (qui contient le hachage) et nous vérifierons s'il correspond à celui de la base de données. Créons une variable locale appelée $ hash et générons un hash md5 aléatoire.
$ hash = md5 (rand (0,1000)); // Génère un hash aléatoire de 32 caractères et l'assigne à une variable locale. // Exemple de sortie: f4552671f8909587cf485ea990207f3bQu'avons-nous fait? Nous utilisons la fonction PHP "rand" pour générer un nombre aléatoire compris entre 0 et 1000. Notre fonction MD5 transformera ensuite ce nombre en chaîne de texte de 32 caractères que nous utiliserons dans notre courrier électronique d’activation. Mon choix est d’utiliser MD5, car il génère un hachage de 32 caractères qui est sécurisé et, dans ce cas, impossible à craquer..
Créer un mot de passe aléatoire
Nous devons ensuite créer un mot de passe aléatoire pour notre membre:
$ mot de passe = rand (1000,5000); // Génère un nombre aléatoire compris entre 1000 et 5000 et l'affecte à une variable locale. // Exemple de sortie: 4568Insérez les informations suivantes dans notre base de données à l'aide d'une requête MySQL
mysql_query ("INSERT INTO utilisateurs (nom d'utilisateur, mot de passe, email, hash) VALUES ('". mysql_escape_string ($ name). "', '". mysql_escape_string (md5 ($ password)). "'," ". mysql_escape_string ($ email). "','". mysql_escape_string ($ hash). "')") ou die (mysql_error ());Comme vous pouvez le constater, nous insérons toutes les données entourées d'une chaîne d'échappement MySQL afin d'empêcher toute injection de MySQL..
Vous remarquerez peut-être aussi que la fonction MD5 change le mot de passe aléatoire en un hachage sécurisé pour la protection. Exemple: si une personne "perverse" accède à la base de données, elle ne peut pas lire les mots de passe.Pour tester, remplissez le formulaire et vérifiez si les données sont insérées dans notre base de données.
Étape 5 - Envoyez le courrier électronique de vérification
Dès que nous avons inséré les informations dans notre base de données, nous devons envoyer un courrier électronique à l'utilisateur avec le lien de vérification. Utilisons donc la fonction "mail" de PHP pour le faire.
$ to = $ email; // Envoyer un courrier électronique à notre utilisateur $ subject = 'Inscription | Vérification'; // Donner à l'email un sujet $ message = 'Merci pour votre inscription! Votre compte a été créé, vous pouvez vous connecter avec les informations d'identification suivantes après avoir activé votre compte en appuyant sur l'URL ci-dessous. ------------------------ Nom d'utilisateur: '. $ Name.' Mot de passe: '. $ Mot de passe.' ------------------------ Veuillez cliquer sur ce lien pour activer votre compte: http://www.votresiteweb.com/verify.php?email= ' . $ email. '& hash ='. $ hash. "; // Notre message ci-dessus, y compris le lien $ headers = 'De: [email protected]'." \ r \ n "; // Définir à partir de l'en-tête mail ($ to, $ subject, $ message, $ headers); // Envoyez notre courrier électroniqueFreinons maintenant le message:
Merci pour votre inscription! Votre compte a été créé, vous pouvez vous connecter avec les informations d'identification suivantes après avoir activé votre compte en appuyant sur l'URL ci-dessous. ------------------------ Nom d'utilisateur: '. $ Name.' Mot de passe: '. $ Mot de passe.' ------------------------Dans le code ci-dessus, nous envoyons une courte description à notre utilisateur, qui contient le nom d'utilisateur et le mot de passe, en utilisant les variables locales que nous avons créées lors de la publication des données..
Veuillez cliquer sur ce lien pour activer votre compte: http://www.votresiteweb.com/verify.php?email='.$email.'&hash='.$hash. 'Dans cette section du code, nous avons créé un lien dynamique. Le résultat de ceci ressemblera à ceci:
Comme vous pouvez le constater, cela crée une URL solide, impossible à deviner. C'est un moyen très sécurisé de vérifier l'adresse email d'un utilisateur.
Étape 6 - Activation du compte
Comme vous pouvez le voir, nos liens d’URL à verify.php Nous allons donc créer cela en utilisant le même modèle de base que nous avons utilisé pour index.php..
Cependant, supprimez le formulaire du modèle.NETTUTS> Inscrivez-vous NETTUTS> Inscrivez-vous
La première chose à faire est de vérifier si nous avons nos variables $ _GET (email et hash)
if (isset ($ _GET ['email']) &&! vide ($ _GET ['email']) ET isset ($ _GET ['hash']) &&! vide ($ _GET ['hash'])) / / Verify data else // Approche non validePour simplifier un peu les choses, assignons nos variables locales et ajoutons un peu de prévention des injections MySQL en utilisant à nouveau la chaîne d'échappement MySQL..
if (isset ($ _GET ['email']) &&! vide ($ _GET ['email']) ET isset ($ _GET ['hash']) &&! vide ($ _GET ['hash'])) / / Verify data $ email = mysql_escape_string ($ _GET ['email']); // Définir la variable email $ hash = mysql_escape_string ($ _GET ['hash']); // Définir la variable de hachageSuivant est de vérifier les données de l'URL contre les données de notre base de données en utilisant une requête MySQL.
$ search = mysql_query ("SELECT email, hash, actif FROM utilisateurs WHERE. $ email." "AND. $ hash." "AND active =" 0 "") ou die (mysql_error ()); $ match = mysql_num_rows ($ search);Dans le code ci-dessus, nous avons utilisé une instruction select MySQL et vérifié si l’adresse de courrier électronique et le hachage correspondaient. Mais à côté de cela, nous avons vérifié si le statut du compte était "inactif". Enfin, nous utilisons mysql_num_rows pour déterminer le nombre de correspondances trouvées. Alors essayons ceci. Utilisez simplement un écho simple pour renvoyer les résultats.
$ search = mysql_query ("SELECT email, hash, actif FROM utilisateurs WHERE. $ email." "AND. $ hash." "AND active =" 0 "") ou die (mysql_error ()); $ match = mysql_num_rows ($ search); echo $ match; // Affiche le nombre de correspondances trouvées -> supprime cela une fois terminé avec testing;)Nous avons un RENCONTRE! Pour changer le résultat, changez simplement l'email et vous verrez que le numéro retourné est 0.
Nous pouvons utiliser notre match de $ variable pour activer le compte ou renvoyer une erreur lorsqu'aucune correspondance n'a été trouvée.if ($ match> 0) // Nous avons une correspondance, activez le compte else // Aucune correspondance -> URL non valide ou le compte a déjà été activé.Pour activer le compte, nous devons mettre à jour le actif champ à 1 en utilisant une requête MySQL.
// Nous avons une correspondance, activez le compte mysql_query ("UPDATE users SET active =" 1 "WHERE. $ Email." "AND. $ Hash." "AND active =" 0 "") ou die (mysql_error ()) ; écho 'Votre compte a été activé, vous pouvez maintenant vous connecter';Nous utilisons donc les mêmes termes de recherche pour la mise à jour que nous avons utilisés dans notre requête de sélection MySQL. Nous passons actif à 1 où l'email, le hachage et le champ actif = 0 correspondent. Nous renvoyons également un message indiquant à l'utilisateur que son compte a été activé. Vous pouvez ajouter un message, comme nous l’avons fait ici, à la partie "Aucune correspondance". Donc, le code final devrait ressembler à:
mysql_connect ("localhost", "tutorial", "password") ou die (mysql_error ()); // Connectez-vous au serveur de base de données (localhost) avec un nom d'utilisateur et un mot de passe. mysql_select_db ("registrations") ou die (mysql_error ()); // Sélectionnez la base de données d'inscription. if (isset ($ _GET ['email']) &&! vide ($ _GET ['email']) ET isset ($ _GET ['hash']) &&! vide ($ _GET ['hash'])) / / Verify data $ email = mysql_escape_string ($ _GET ['email']); // Définir la variable email $ hash = mysql_escape_string ($ _GET ['hash']); // Définit la variable de hachage $ search = mysql_query ("SELECT email, hash, actif FROM utilisateurs WHERE. $ Email." "AND. $ Hash." "AND active =" 0 "") ou die (mysql_error ()); $ match = mysql_num_rows ($ search); if ($ match> 0) // Nous avons une correspondance, activez le compte mysql_query ("UPDATE users SET active =" 1 "WHERE. $ email." "AND. $ hash." "AND active =" 0 "" ) ou die (mysql_error ()); écho 'Votre compte a été activé, vous pouvez maintenant vous connecter'; else // Pas de correspondance -> URL non valide ou compte déjà activé. écho 'L'URL est invalide ou vous avez déjà activé votre compte..'; else // Approche non valide echo 'Approche invalide, veuillez utiliser le lien qui a été envoyé à votre email..';Si vous visitez verify.php sans aucune chaîne, l'erreur suivante sera affichée:
Étape 7 - Connexion
Dans cette dernière étape, je vais vous montrer comment créer un formulaire de connexion de base et vérifier si le compte est activé. Commencez par créer un nouveau fichier appelé login.php avec le modèle de base que nous utilisions auparavant, mais cette fois j'ai changé le formulaire en un formulaire de connexion.
NETTUTS> Inscrivez-vous NETTUTS> Inscrivez-vous
'; // Affiche notre message et ajoute un div autour de lui avec la classe statusmsg?>Formulaire de connexion
Veuillez entrer votre nom et votre mot de passe pour vous connecter
'. $ msg.'
Le formulaire est un html de base, et presque identique au formulaire d’inscription, aucune autre explication n’est nécessaire. Il est maintenant temps d'écrire le code du script de connexion, que nous écrirons juste en dessous du code de connexion MySQL. Nous commençons avec quelque chose que nous avons également fait dans le formulaire d'inscription.
if (isset ($ _ POST ['name']) &&! empty ($ _ POST ['name']) ET isset ($ _ POST ['password']) &&! empty ($ _ POST ['password'])) / / Les deux champs sont en train d'être postés et il n'y a pas de vide
Nous vérifions donc d'abord si les données sont en train d'être publiées et nous nous assurons qu'elles ne sont pas vides..
Suivant consiste à créer des variables locales pour les données de publication:
if (isset ($ _ POST ['name']) &&! empty ($ _ POST ['name']) ET isset ($ _ POST ['password']) &&! empty ($ _ POST ['password'])) $ nom d'utilisateur = mysql_escape_string ($ _ POST ['name']); // Définit la variable pour le nom d'utilisateur $ password = mysql_escape_string (md5 ($ _ POST ['password'])); // Définit une variable pour le mot de passe et le convertit en hachage MD5.
Nous avons créé les variables locales et changé le mot de passe en un hachage md5 pour le faire correspondre au mot de passe que nous avons stocké dans la base de données..
Maintenant, il est temps de créer la connexion à notre table "utilisateurs" et de vérifier si les données saisies sont correctes.
if (isset ($ _ POST ['name']) &&! empty ($ _ POST ['name']) ET isset ($ _ POST ['password']) &&! empty ($ _ POST ['password'])) $ nom d'utilisateur = mysql_escape_string ($ _ POST ['name']); $ password = mysql_escape_string (md5 ($ _ POST ['password'])); $ search = mysql_query ("SELECT nom d'utilisateur, mot de passe, actif à partir d'utilisateurs WHERE. $ nom d'utilisateur." "AND. $ mot de passe." "AND active =" 1 "") ou die (mysql_error ()); $ match = mysql_num_rows ($ search);
Nous avons écrit une requête MySQL qui sélectionnera le nom d'utilisateur, le mot de passe et les informations actives dans notre base de données, si le nom d'utilisateur et le mot de passe correspondent.
ET actif = "1" est! IMPORTANT !, cela garantit que vous ne pouvez vous connecter que si votre compte est activé. Nous utilisons à nouveau les lignes numériques MySQL pour voir le nombre de correspondances trouvées..
if ($ match> 0) $ msg = 'Connexion complète! Merci'; // Définir le cookie / Démarrer la session / Démarrer le téléchargement, etc. else $ msg = 'Échec de la connexion! Assurez-vous d’entrer les informations correctes et d’avoir activé votre compte. ';
Dans le code ci-dessus, nous vérifions si la connexion a été un succès ou non.
Et c'est la fin de ce tutoriel! J'espère que vous avez apprécié, et si vous l'avez fait s'il vous plaît laissez un commentaire ci-dessous!