欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

PHP登录与防止数据注入实例演示

程序员文章站 2022-03-03 23:13:14
...

PHP登录与防止数据注入实例演示

首先准备一张简单的用户数据表

PHP登录与防止数据注入实例演示

编写database.php

  1. <?php
  2. return [
  3. 'type' => $type ?? 'mysql',
  4. 'username' => $username ?? 'root',
  5. 'password' => $password ?? 'root',
  6. 'host' => $host ?? 'localhost',
  7. 'port' => $port ?? '3308',
  8. 'charset' => $charset ?? 'utf8',
  9. 'dbname' => 'mydatabase'
  10. ];

编写connect.php

  1. <?php
  2. // 1. 把数据库连接配置文件引过来
  3. $config = require_once 'database.php';
  4. extract($config);
  5. // 2. 数据库的连接
  6. $dsn = sprintf('%s:host=%s;port=%s;charset=%s;dbname=%s', $type, $host, $port, $charset, $dbname);
  7. try {
  8. $pdo = new PDO($dsn, $username, $password);
  9. //var_dump($pdo);
  10. } catch (PDOException $e) {
  11. die('Connection error : ' . $e->getMessage());
  12. }

编写login.php

  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8">
  5. <title>系统登录</title>
  6. </head>
  7. <style type="text/css">
  8. html {
  9. overflow-y: scroll;
  10. vertical-align: baseline;
  11. }
  12. body {
  13. font-family: Microsoft YaHei, Segoe UI, Tahoma, Arial, Verdana, sans-serif;
  14. font-size: 12px;
  15. color: #fff;
  16. height: 100%;
  17. line-height: 1;
  18. background: #999
  19. }
  20. * {
  21. margin: 0;
  22. padding: 0
  23. }
  24. ul,
  25. li {
  26. list-style: none
  27. }
  28. h1 {
  29. font-size: 30px;
  30. font-weight: 700;
  31. text-shadow: 0 1px 4px rgba(0, 0, 0, .2)
  32. }
  33. .login-box {
  34. width: 410px;
  35. margin: 120px auto 0 auto;
  36. text-align: center;
  37. padding: 30px;
  38. background: url('http://demo.mxyhn.xyz:8020/cssthemes6/11.20ZF8/images/mask.png');
  39. border-radius: 10px;
  40. }
  41. .login-box .name,
  42. .login-box .password,
  43. .login-box .code,
  44. .login-box .remember {
  45. font-size: 16px;
  46. text-shadow: 0 1px 2px rgba(0, 0, 0, .1)
  47. }
  48. .login-box .remember input {
  49. box-shadow: none;
  50. width: 15px;
  51. height: 15px;
  52. margin-top: 25px
  53. }
  54. .login-box .remember {
  55. padding-left: 40px
  56. }
  57. .login-box .remember label {
  58. display: inline-block;
  59. height: 42px;
  60. width: 70px;
  61. line-height: 34px;
  62. text-align: left
  63. }
  64. .login-box label {
  65. display: inline-block;
  66. width: 100px;
  67. text-align: right;
  68. vertical-align: middle
  69. }
  70. .login-box #code {
  71. width: 120px
  72. }
  73. .login-box .codeImg {
  74. float: right;
  75. margin-top: 26px;
  76. }
  77. .login-box img {
  78. width: 148px;
  79. height: 42px;
  80. border: none
  81. }
  82. input[type=text],
  83. input[type=password] {
  84. width: 270px;
  85. height: 42px;
  86. margin-top: 25px;
  87. padding: 0px 15px;
  88. border: 1px solid rgba(255, 255, 255, .15);
  89. border-radius: 6px;
  90. color: #fff;
  91. letter-spacing: 2px;
  92. font-size: 16px;
  93. background: transparent;
  94. }
  95. button {
  96. cursor: pointer;
  97. width: 100%;
  98. height: 44px;
  99. padding: 0;
  100. background: #ef4300;
  101. border: 1px solid #ff730e;
  102. border-radius: 6px;
  103. font-weight: 700;
  104. color: #fff;
  105. font-size: 24px;
  106. letter-spacing: 15px;
  107. text-shadow: 0 1px 2px rgba(0, 0, 0, .1)
  108. }
  109. input:focus {
  110. outline: none;
  111. box-shadow: 0 2px 3px 0 rgba(0, 0, 0, .1) inset, 0 2px 7px 0 rgba(0, 0, 0, .2)
  112. }
  113. button:hover {
  114. box-shadow: 0 15px 30px 0 rgba(255, 255, 255, .15) inset, 0 2px 7px 0 rgba(0, 0, 0, .2)
  115. }
  116. .screenbg {
  117. position: fixed;
  118. bottom: 0;
  119. left: 0;
  120. z-index: -999;
  121. overflow: hidden;
  122. width: 100%;
  123. height: 100%;
  124. min-height: 100%;
  125. }
  126. .screenbg ul li {
  127. display: block;
  128. list-style: none;
  129. position: fixed;
  130. overflow: hidden;
  131. top: 0;
  132. left: 0;
  133. width: 100%;
  134. height: 100%;
  135. z-index: -1000;
  136. float: right;
  137. }
  138. .screenbg ul a {
  139. left: 0;
  140. top: 0;
  141. width: 100%;
  142. height: 100%;
  143. display: inline-block;
  144. margin: 0;
  145. padding: 0;
  146. cursor: default;
  147. }
  148. .screenbg a img {
  149. vertical-align: middle;
  150. display: inline;
  151. border: none;
  152. display: block;
  153. list-style: none;
  154. position: fixed;
  155. overflow: hidden;
  156. top: 0;
  157. left: 0;
  158. width: 100%;
  159. height: 100%;
  160. z-index: -1000;
  161. float: right;
  162. }
  163. .bottom {
  164. margin: 8px auto 0 auto;
  165. width: 100%;
  166. position: fixed;
  167. text-align: center;
  168. bottom: 0;
  169. left: 0;
  170. overflow: hidden;
  171. padding-bottom: 8px;
  172. color: white;
  173. word-spacing: 3px;
  174. zoom: 1;
  175. }
  176. .bottom a {
  177. color: #FFF;
  178. text-decoration: none;
  179. }
  180. .bottom a:hover {
  181. text-decoration: underline;
  182. }
  183. </style>
  184. <script type="text/javascript" src="http://demo.mxyhn.xyz:8020/cssthemes6/11.20ZF8/js/jquery-1.8.2.min.js"></script>
  185. <script type="text/javascript">
  186. $(function() {
  187. $(".screenbg ul li").each(function() {
  188. $(this).css("opacity", "0");
  189. });
  190. $(".screenbg ul li:first").css("opacity", "1");
  191. var index = 0;
  192. var t;
  193. var li = $(".screenbg ul li");
  194. var number = li.size();
  195. function change(index) {
  196. li.css("visibility", "visible");
  197. li.eq(index).siblings().animate({
  198. opacity: 0
  199. }, 3000);
  200. li.eq(index).animate({
  201. opacity: 1
  202. }, 3000);
  203. }
  204. function show() {
  205. index = index + 1;
  206. if (index <= number - 1) {
  207. change(index);
  208. } else {
  209. index = 0;
  210. change(index);
  211. }
  212. }
  213. t = setInterval(show, 8000);
  214. //根据窗口宽度生成图片宽度
  215. var width = $(window).width();
  216. $(".screenbg ul img").css("width", width + "px");
  217. });
  218. </script>
  219. <body>
  220. <div class="login-box">
  221. <h1>瓜子二手车系统后台登录</h1>
  222. <form>
  223. <div class="name">
  224. <label>管理员账号:</label>
  225. <input type="text" required name="username" id="" tabindex="1" autocomplete="off" />
  226. </div>
  227. <div class="password">
  228. <label>密 码:</label>
  229. <input type="password" required name="password" maxlength="16" id="" tabindex="2" />
  230. </div>
  231. <!-- <div class="code">
  232. <label>验证码:</label>
  233. <input type="text" name="" maxlength="4" id="code" tabindex="3" />
  234. <div class="codeImg">
  235. <img src="images/captcha.jpeg.jpg" />
  236. </div>
  237. </div> -->
  238. <div class="remember">
  239. <input type="checkbox" id="remember" tabindex="4">
  240. <label>记住密码</label>
  241. </div>
  242. <div class="login">
  243. <input type="button" name="btn" value="登录">
  244. </div>
  245. </form>
  246. </div>
  247. <div class="bottom">©2022 </div>
  248. <div class="screenbg">
  249. <ul>
  250. <li><a href="javascript:;"><img src="http://demo.mxyhn.xyz:8020/cssthemes6/11.20ZF8/images/0.jpg"></a></li>
  251. <li><a href="javascript:;"><img src="http://demo.mxyhn.xyz:8020/cssthemes6/11.20ZF8/images/1.jpg"></a></li>
  252. <li><a href="javascript:;"><img src="http://demo.mxyhn.xyz:8020/cssthemes6/11.20ZF8/images/2.jpg"></a></li>
  253. </ul>
  254. </div>
  255. <div style="text-align:center;">
  256. </div>
  257. <script type="text/javascript">
  258. // 登录
  259. $('input[name="btn"]').click(function() {
  260. var data = {};
  261. data.username = $.trim($('input[name="username"]').val());
  262. data.password = $.trim($('input[name="password"]').val());
  263. $.post('submit.php', data, function(res) {
  264. console.log(res);
  265. }, "json")
  266. })
  267. </script>
  268. </body>
  269. </html>

编写submit.php

  1. // 后端接受前端穿过来的参数
  2. $name = isset($_POST['username']) ? $_POST['username'] : null;
  3. $pwd = isset($_POST['password']) ? $_POST['password'] : null;
  4. // 1.连接数据库
  5. require_once 'connect.php';
  6. // 检查密码的正确性
  7. $pwd = md5($pwd);
  8. $stmt = $pdo->query("SELECT * FROM `userinfo` WHERE `username`='{$name}' AND `password` = '{$pwd}' ");
  9. //var_dump($stmt);
  10. foreach ($stmt as $row) {
  11. print $row['username'] . "\t";
  12. print $row['password'] . "\t";
  13. print $row['id'] . "\n";
  14. }

PHP登录与防止数据注入实例演示

正常登录打印,但是当我们在用户名入' or 1=1#

就会发现…

PHP登录与防止数据注入实例演示

数据全给打印出来了。。。

因此,重新编辑submit.php如下

  1. <?php
  2. // 后端接受前端穿过来的参数
  3. $name = isset($_POST['username']) ? $_POST['username'] : null;
  4. $pwd = isset($_POST['password']) ? $_POST['password'] : null;
  5. // 1.连接数据库
  6. require_once 'connect.php';
  7. // 检查密码的正确性
  8. $pwd = md5($pwd);
  9. $stmt = $pdo->query("SELECT * FROM `userinfo` WHERE `username`='{$name}' AND `password` = '{$pwd}' ");
  10. //var_dump($stmt);
  11. // foreach ($stmt as $row) {
  12. // print $row['username'] . "\t";
  13. // print $row['password'] . "\t";
  14. // print $row['id'] . "\n";
  15. // }
  16. // pdo预处理
  17. // 准备一条预处理sql语句
  18. $sql = "SELECT * FROM `user` WHERE `username`= ? AND `password` = ? ";
  19. // 准备要执行的语句,并返回语句对象
  20. $stmt = $pdo->prepare($sql);
  21. // 绑定参数到指定的变量名
  22. $stmt->bindParam(1, $name);
  23. $stmt->bindParam(2, $pwd);
  24. // 执行一条预处理语句
  25. $stmt->execute();
  26. $result = $stmt->fetchAll(PDO::FETCH_ASSOC);
  27. var_dump($result);

增加数据库预处理语句,大功告成!