Maison  >  Article  >  développement back-end  >  Code source PHP : Comment créer un site pour implémenter une page de connexion

Code source PHP : Comment créer un site pour implémenter une page de connexion

不言
不言original
2018-07-04 14:52:315735parcourir

Cet article présente principalement la méthode de création d'un site Web pour implémenter la page de connexion avec le code source PHP. Maintenant, je le partage avec vous. Les amis dans le besoin peuvent s'y référer

<.> Principal :

  1. SiteBâtiment

  2. Implémenter la page de connexion

  3. Analyse et amélioration


Construction du site

1) Dans le répertoire d'installation d'Apache : [confextrahttpd-vhosts.conf] Ajouter la configuration du site

 1 <VirtualHost *:80> 
 2     #站点根目录 
 3     DocumentRoot "D:\htdocs\Demo" 
 4       #站点绑定的域名 
 5     ServerName www.test.com 
 6      #站点别名 
 7     ServerAlias test.com 
 8   <Directory  "D:\htdocs\Demo"> 
 9         #允许所有访问
 10         #allow from all
 11         Require all granted
 12         #允许分布式权限配置(允许重写)(.htacess)
 13         AllowOverride All
 14         #不显示站点目录的文件结构
 15         Options -indexes
 16   </Directory>
 17 </VirtualHost>
2) Ajouter la résolution du nom de domaine au fichier hôte. Emplacement du fichier hôte : [C:WindowsSystem32driversetchosts]

1 127.0.0.1 www.test.com  test.com
3) Redémarrez Apache. Configuration complète du site.

Implémenter la page de connexion

1) Créer le blog du répertoire du projet [

D:htdocsDemoblog], initialiser git et soumettre au cloud de code

Clic droit dans le répertoire du projet》Git Bash Prérequis : git a été installé

1  git init 
2  git remote add origin  
3  git pull origin master
2) Table de données utilisateur

pbg_users

 1 CREATE TABLE `pbg_users` ( 
 2   `id` int(10) unsigned NOT NULL AUTO_INCREMENT COMMENT &#39;用户主键&#39;, 
 3   `username` varchar(20) NOT NULL COMMENT &#39;用户名&#39;, 
 4   `pwd` char(32) NOT NULL COMMENT &#39;密码&#39;, 
 5   `email` varchar(50) NOT NULL DEFAULT &#39;&#39; COMMENT &#39;注册邮箱&#39;, 
 6   `token_email` varchar(32) NOT NULL DEFAULT &#39;&#39; COMMENT &#39;邮箱验证&#39;, 
 7   `flag` tinyint(1) unsigned NOT NULL DEFAULT &#39;0&#39; COMMENT &#39;是否是管理员,1-管理员,2-普通用户&#39;, 
 8   `created_at` datetime DEFAULT NULL COMMENT &#39;注册时间&#39;, 
 9   `updated_at` datetime DEFAULT NULL COMMENT &#39;最后一次登录时间&#39;,
 10   `login_ip` varchar(20) NOT NULL DEFAULT &#39;&#39; COMMENT &#39;最后登录的ip地址&#39;,
 11   `login_times` smallint(6) NOT NULL DEFAULT &#39;0&#39; COMMENT &#39;登录次数&#39;,
 12   PRIMARY KEY (`id`),
 13   UNIQUE KEY `username` (`username`),
 14   UNIQUE KEY `email` (`email`)
 15 ) ENGINE=MyISAM AUTO_INCREMENT=1 DEFAULT CHARSET=utf8;
3) Interface de connexion 【login.html】

 1 <!DOCTYPE html> 
 2 <html lang="zh-CN"> 
 3 <head> 
 4     <meta charset="UTF-8"> 
 5     <title>登录</title> 
 6     <link rel="stylesheet" type="text/css" href="layui/css/layui.css"> 
 7     <link rel="stylesheet" type="text/css" href="css/style.css"> 
 8 </head> 
 9 <body>
 10 <p class="container">
 11     <p class="content">
 12         <form action="login.php" class="layui-form" method="post">
 13             <p class="layui-form-item">
 14                 <h2>登录</h2>
 15             </p><hr>
 16 
 17             <p class="layui-form-item">
 18                 <label class="layui-form-label">用户名:</label>
 19                 <p class="layui-input-block">
 20                     <input type="text" name="username" class="layui-input" required  lay-verify="required"  placeholder="请输入用户名" autocomplete="off" >
 21                 </p>
 22             </p>
 23 
 24             <p class="layui-form-item">
 25                 <label class="layui-form-label">密   码:</label>
 26                 <p class="layui-input-block">
 27                     <input type="password" name="pwd" required lay-verify="required" placeholder="请输入密码"  class="layui-input">
 28                 </p>
 29             </p>
 30 
 31             <p class="layui-form-item">
 32                 <p class="layui-input-block">
 33                     <button  lay-submit class="layui-btn">登录</button>
 34                     <button type="reset" class="layui-btn layui-btn-primary">重置</button>
 35                 </p>
 36             </p>
 37         </form>
 38     </p>
 39 </p>
 40 <script type="text/javascript" src="layui/layui.js"></script>
 41 <script>
 42     layui.use(&#39;form&#39;, function(){
 43         var form = layui.form;
 44     });
 45 </script>
 46 </body>
 47 </html>
4) Ajustement du style de la page de connexion【css/style.css】

 1 @charset "UTF-8"; 
 2  
 3 body { 
 4     background-color: #1E9FFF; 
 5 } 
 6  
 7 /*登录*/
 8 .container { 
 9     position: absolute;
 10     left: 50%;
 11     top:50%;
 12     width: 500px;
 13     margin-left: -250px;
 14     margin-top: -200px;"
 15 }
 16 .content{
 17     background: #ffffff;
 18     padding: 20px;
 19     border-radius: 4px;
 20     box-shadow: 5px 5px 50px #444444;
 21 }

Afficher la feuille de style

5) Opération de connexion : Traiter les informations de connexion 【login.php】

 1 <?php 
 2 /** 
 3  * 登录数据处理 
 4  * User: young 
 5  */ 
 6 header("content-type:text/html;charset=utf-8"); 
 7 //1-接收登录信息 
 8 $data = array(); 
 9 $data[&#39;username&#39;] = trim($_POST[&#39;username&#39;]);
 10 $data[&#39;pwd&#39;] = trim($_POST[&#39;pwd&#39;]);
 11 
 12 //2-连接数据库
 13 $conn = @mysql_connect(&#39;localhost&#39;,&#39;root&#39;,&#39;root&#39;) or die(&#39;连接数据库失败!&#39;);
 14 // mysql_set_charset("utf8");
 15 // mysql_select_db("web");
 16 mysql_query(&#39;set names utf8&#39;,$conn);
 17 mysql_query(&#39;use web&#39;,$conn);
 18 
 19 //3-查询数据库  校验登录信息
 20 $sql = "select username,pwd from pbg_users where username=&#39;{$data[&#39;username&#39;]}&#39;";
 21 $res = mysql_query($sql,$conn);
 22 
 23 //4-登录结果提示信息
 24 if($res != false){
 25     $user = mysql_fetch_array($res);
 26     if( $user[&#39;pwd&#39;] == md5($data[&#39;pwd&#39;]) ){ exit(&#39;登录成功&#39;); }
 27 }
 28 echo "用户名或密码不正确!";
 29 header(&#39;refresh:3; url=login.html&#39;);

Cliquez pour voir

6) Effet de l'interface de connexion

Code source PHP : Comment créer un site pour implémenter une page de connexion

Améliorations de l'analyse

1) Préparez-vous à optimiser la

  1. structure de répertoires de fichiers et à implémenter la structure MVC

  2. Formulaire d'accès : Réaliser un accès aux fichiers à entrée unique

2) Soumettre le code :

1 git add -A
2 git commit -m "第一次提交 && 登录页"
3 git push origin master
Voir le code source de ce projet : https://gitee.com/ NewbiesYang/young_blog

Résumé : Les principales réalisations cette fois sont :

1. Configuration du site

2. et production de pages de connexion, mise en œuvre simple de la logique de connexion

3. Optimisation et amélioration de la prochaine étape

Ce qui précède est l'intégralité du contenu de cet article. J'espère qu'il sera utile à l'apprentissage de chacun. plus de contenu connexe, veuillez faire attention au site Web PHP chinois !

Recommandations associées :

Méthode de code source php pour implémenter la structure MVC à entrée unique

suppression par lots php du fichier de projet Méthode bom headers

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn