码迷,mamicode.com
首页 > Web开发 > 详细

20182217刘洪宇_Exp8 Web综合

时间:2021-06-02 20:11:04      阅读:0      评论:0      收藏:0      [点我收藏+]

标签:方便   none   ext   创建用户   类型   正则表达   完成   ogre   suse   

一、实验内容

(1)Web前端HTML 

能正常安装、启停Apache。理解HTML,理解表单,理解GET与POST方法,编写一个含有表单的HTML。

  • kali默认已安装Apache,直接使用  service apache2 start 打开apache服务
  • 使用 service apache2 status 查看服务情况
    技术图片

     

     

  • 此时在浏览器输入 127.0.0.1 ,如果可以打开Apache的默认网页,则表示开启成功
    技术图片

     

     

  • 使用 cd /var/www/html 进入Apache目录下,新建一个简单的含有表单的html文件
     1 <html> 
     2 <head> 
     3 <title>Login</title> 
     4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> </head> 
     5 <body> 
     6     <h2 align="center">Login</h2> 
     7             <center> 
     8         <form action="login" method="post"> 
     9             <input placeholder="E-mail" name="Name" class="user" type="email"> 
    10             <br> 
    11             </br> 
    12             <input placeholder="Password" name="Password" class="pass" type="password"> 
    13             <br> 
    14             </br> 
    15             <input type="submit" value="Login"> 
    16     </form> 
    17             </center> 
    18 </body> 
    19 </html>

    技术图片

     

     

     

  • 在浏览器中输入  /var/www/html/form.html  打开网页如下所示:
    技术图片

     

     



(2)Web前端javascipt 

理解JavaScript的基本功能,理解DOM。 在(1)的基础上,编写JavaScript验证用户名、密码的规则。在用户点击登陆按钮后回显“欢迎+输入的用户名” 。

  • 编写JavaScript验证用户名、密码的规则。在原有 form.html 基础上,可以添加一段JavaScript代码,以完成对用户是否填写邮箱和密码的判断。修改后的html如下
     1 <html>
     2 <head>
     3 <title>CryptoTeam</title>
     4 <!-- Meta tag Keywords -->
     5 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
     6 <!-- Meta tag Keywords -->
     7 </head>
     8 <body>
     9 <!-- main -->
    10 <!--//header-->
    11     <h2>Login Quick</h2>
    12         <form action="login" method="post" name="form_login">
    13             <input placeholder="E-mail" name="Email" class="user" type="email" onfocus="if (this.value==‘Your email‘) this.value=‘‘;" />
    14             <br>
    15             </br>
    16             <input  placeholder="Password" name="Password" class="pass" type="password" onfocus="if (this.value==‘Your password‘) this.value=‘‘;"/>
    17             <br>
    18             </br>
    19             <input type="submit" value="Login" onClick="return validateLogin()"/>
    20         </form>
    21 <!--//main-->
    22 <script language="javascript">  
    23     function validateLogin(){  
    24         var sUserName = document.form_login.Email.value ;  
    25         var sPassword = document.form_login.Password.value ;    
    26         if ((sUserName =="") || (sUserName=="Your email")){  
    27         alert("user email!");  
    28         return false ;  
    29         }  
    30         if ((sPassword =="") || (sPassword=="Your password")){  
    31         alert("password!");  
    32         return false ;  
    33         }  
    34     }   
    35 </script>  
    36 </body>
    37 </html>

    技术图片

     

     

     

  • 访问修改后的form.html
    技术图片

     

     

  • 登录不输入密码
    技术图片

     

     

  • 登录不输入账号
    技术图片

     

     

 

(3)Web后端:MySQL基础:正常安装、启动MySQL,建库、创建用户、修改密码、建表 

  • 输入 service mysql start 开启MySQL服务
  • 输入 mysql -u root -p 使用root权限进入,默认的密码是 password
    技术图片

     

  • show databases;  命令查看数据库基本信息(注意";")
    技术图片

     

  • use mysql;  选择使用mysql这个数据库
    技术图片
  • select user, password, host from user;  查看当前用户信息
    技术图片
  • update user set password=PASSWORD("20182217") where user=root; 修改密码
    技术图片
  • flush privileges; 更新权限
  • exit 退出
    技术图片

 

  •  create database br;  建立数据库
  •  show databases;  查看存在的数据库
    技术图片

     

     

  • use 数据库名称; 使用我们创建的数据库
  •  create table login (username VARCHAR(20),password VARCHAR(20));  建立数据库表,并设置字段基本信息。这里使用varchar类型而不是char类型,原因为char类型指定大小后会预分配固定大小,不管是否使用空间都被占用;varchar类型则根据实际应用的大小占据空间。
    技术图片

     

     

  • show tables; 查看表信息
    技术图片

     

     

 

 

  •  insert into login values(20182217br@qq.com,20182217);  插入数据
  •  select * from login(表名);  查询表中的数据
    技术图片

     

     

  • GRANT select,insert,update,delete ON br.*  TO br@localhost (可以是localhost,也可以是远程登录方式的IP)identified by "20182217";

     

  •  exit 
    技术图片

     

     

  • 登录成功 
    技术图片

     

     

 

 

(4).Web后端:编写PHP网页,连接数据库,进行用户认证 

  • 在  /var/www/html  目录下新建一个PHP测试文件phptest.php

    1 <?php 
    2 echo ($_GET["a"]); 
    3 include($_GET["a"]); 
    4 echo "Hello 20182217!<br>"; 
    5 ?>

    技术图片

     

     

     

  • 在浏览器网址栏中输入  localhost:80/phptest.php  
    技术图片

     

     

  • 也可以在浏览器网址栏中输入  localhost:80/phptest.php?a=/etc/passwd ,可看到 /etc/passwd文件的内容
    技术图片

     

     

  •  将 login.html中的 action 设为 login.php
    技术图片

     

     

  • 利用PHP和MySQL,结合之前编写的登录网页进行登录身份认证, login.php代码如下:
     1 <?php
     2 $uname=$_POST["Email"];
     3 $pwd=$_POST["Password"];
     4 echo $uname;
     5 $query_str="SELECT * FROM login where username=‘$uname‘ and password=‘$pwd‘;";
     6 $mysqli = new mysqli("127.0.0.1", "br", "20182217", "br");
     7 
     8 /* check connection */
     9 if ($mysqli->connect_errno) {
    10 printf("Connect failed: %s\n", $mysqli->connect_error);
    11 exit();
    12 }
    13 echo " connection ok!";
    14 /* Select queries return a resultset */
    15 if ($result = $mysqli->query($query_str)) {
    16 if ($result->num_rows >= 0 ){
    17 echo "<br> {$uname}:Welcome login!! <br> ";
    18 }
    19 else {
    20 echo "<br> login failed!!!! <br> " ; }
    21 /* free result set */
    22 $result->close();
    23 }
    24 $mysqli->close();
    25 ?>

     


    技术图片

     

     

     

     

  • 在浏览器中输入 127.0.0.1/form.html 进入登录界面,输入正确的用户名和密码登陆,登陆成功界面如下:
    技术图片

     

     技术图片

     

     

(5).最简单的SQL注入,XSS攻击测试 

  •  SQL注入

 

    • 准备工作:把 login.html中用户名input 标签中的 type字段从email更改为text,否则必须以邮箱的格式填写用户名
    • 在用户名输入框输入 ‘ or 1=1# ,密码任意输入,可登陆成功!
      技术图片

       

       技术图片

       

       技术图片

       

       

    • sql注入语句
       select * from users where username=‘‘ or 1=1#‘ and password=‘‘  
    • #注释掉了其后的所有语句,即不需要password的验证,且用户名为永真,可以登陆成功。
  • XXS攻击
    • 将一张图片放在 /var/www/html目录下并命名为 br.jpg ,在用户名输入框输入 <img src="br.jpg" /> ,随便输入密码,就能够读取图片
      技术图片

       

       技术图片

       

       

       

 

 

二、基础问题回答

  • (1)什么是表单
    • 表单用于接收用户的输入,当用户提交表单时,浏览器将用户在表单中输入的数据打包,并发送给服务器,从而实现用户与Web服务器的交互。

    • HTML中表单的编写由<form>开始,</form>结束。

    • 表单组成部件

      • form元素:创建表单。通过 action、method和enctype设置表单的提交路径、提交方式、编码类型。
      • 表单控件:收集用户数据。包括 label、input、textarea、select、datalist、keygen、progress、meter、output等控件类型。
      • 表单按钮:包括提交按钮、重置按钮和一般按钮。提交按钮和一般按钮可用于把表单数据发送到服务器,重置按钮用于重置表单,把整个表单恢复到初始状态。
  • (2)浏览器可以解析运行什么语言。
    • 浏览器可以解析HTML,XML,Python,PHP,JavaScript,ASP等脚本语言。
  • (3)WebServer支持哪些动态语言
    • Web服务器支持ASP,PHP,JSP三种动态语言。
  •   (4) 防范注入攻击的方法有哪些
    • 校验用户输入。可以使用正则表达式验证URL或用户输入;
    • 不使用动态拼装SQL。可以使用参数化的SQL或者直接使用存储过程进行数据查询存取;
    • 不使用管理员权限的数据库连接。要为每个应用使用单独的权限有限的数据库连接;
    • 不能明文存放机密信息。最好加密或者hash掉密码和敏感的信息;
    • 尽可能少的给出应用异常信息提示。最好使用自定义的错误信息对原始错误信息进行包装,把异常信息存放在独立的表中。

三、实验总结和体会

       本次实验涉及到网络编程的一些知识,通过之前的学习,我对这些知识有了一些了解,网络编程中数据库、web前端关系,三者之间缺一不可,前端是显示的画面,数据库负责储存用户信息。还知道了PHP语言功能的强大以及实现的方便性。希望之后也能将这些知识运用到实践当中。

20182217刘洪宇_Exp8 Web综合

标签:方便   none   ext   创建用户   类型   正则表达   完成   ogre   suse   

原文地址:https://www.cnblogs.com/bocaiyu/p/14833749.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!