20171121王朋伟《Web基础》实验报告

一、实验名称

  Web基础

 

二、实验目的和内容

  1．Web前端：HTML

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

  2．Web前端：JavaScript

  理解JavaScript的基本功能，理解DOM。编写JavaScript验证用户名、密码的规则。

  3．Web后端：MySQL基础

  正常安装、启动MySQL，建库、创建用户、修改密码、建表。

  4．Web后端：编写PHP网页

  连接数据库，进行用户认证。

  5．最简单的SQL注入，XSS攻击测试

  功能描述：用户能登陆，登陆用户名密码保存在数据库中，登陆成功显示欢迎页面。

 

三、基础知识和实验准备

  1．Web基础

    1.1 Web前端

      ·编程言语：html/css/javascript(js)

      ·运行环境：浏览器

      ·编程用途：在浏览器内部的动态，美观展示形式

    1.2 Web后端

      ·编程语言：PHP/JSP/.NET...

      ·运行环境：应用服务器/中间件

      ·编程用途：对前端提交的数据进行处理并返回相应的HTML网页内容

    1.3数据库编程

      ·编程语言：PHP/JSP/.NET相应的库，SQL语言

      ·运行环境：数据库服务器

      ·编程用途：基本的数据增、删、改、查

    1.4 类比

      ·内容->属性（HTML)->显示格式(CSS)->动态交互->基于模板动态生成(PHP)

  2．SQL注入

  通过把SQL命令插入到Web表单提交或输入域名或页面请求的查询字符串中，达到欺骗服务器执行恶意的SQL命令。具体来说，它是利用现有应用程序，将（恶意的）SQL命令注入到后台数据库引擎执行的能力，它可以通过在Web表单中输入（恶意）SQL语句得到一个存在安全漏洞的网站上的数据库，而不是按照设计者意图去执行SQL语句。

  3．XSS攻击

  跨站脚本攻击(Cross Site Scripting)，为不和层叠样式表(Cascading Style Sheets, CSS)的缩写混淆，故将跨站脚本攻击缩写为XSS。XSS是一种经常出现在web应用中的计算机安全漏洞，它允许恶意web用户将代码植入到提供给其它用户使用的页面中。比如这些代码包括HTML代码和客户端脚本。攻击者利用XSS漏洞旁路掉访问控制——例如同源策略(same origin policy)。这种类型的漏洞由于被骇客用来编写危害性更大的phishing攻击而变得广为人知。

 

四、实验过程记录

  4.1 Web前端：HTML

  输入“sudo service apache2 start” 开启Apache服务。

  输入“netstat -aptn”查看端口的占用情况，“-a”参数表示显示所有，“-p”参数表示显示PID/Program name，“-t”参数表示只显示tcp，“-n”参数表示以数字形式显示。

  在浏览器中输入127.0.0.1，若显示如下页面（Apache的默认网页，网页中有Apache相关配置文件的地址），则表示Apache服务开启成功。

  输入“cd /var/www/html”进入Apache目录下，输入“sudo vim 1121test1.html”新建一个含有表单的登录测试页面（代码如下图所示）。

  在浏览器中输入“192.168.217.128/1121test1.html”打开登陆测试页面。

 

  4.2 Web前端：JavaScript

  输入“sudo vim 1121test2.html”，新建1121test2.html，在1121test1.html的基础上加上两段<script></script>，一段用于在点击（onclick）“重新输入”按钮时清空表单内容，另一段用于在表单元素password失去焦点（onblur）后检查用户输入的密码是否大于等于6位（代码如下图所示）。

  在浏览器中输入“192.168.217.128/1121test2.html”打开登陆测试页面。当用户输入密码少于6位时，网页弹出提示“密码不足6位，请重新输入”。

  当用户点击“重新输入”按钮时，清空用户名和密码中的内容。

 

  4.3 Web后端：MySQL基础

  输入“sudo service mysql start”启动MySQL服务。

  输入“sudo mysql -u root -p”使用root用户登录，默认密码为空。

  输入“show databases;”查看目前已有的数据库。

  输入“use mysql”使用mysql数据库。

  输入“show tables;”列出mysql数据库中的表格。

  输入“update user set password=PASSWORD("20171121") where user='root';”给root用户修改密码，输入“flush privileges;”更新权限。

  输入“exit”退出，测试新密码是否正确。

  输入“create database wpw20171121;”新建数据库wpw20171121。输入“show databases;”确认数据库新建成功。

  输入“use wpw20171121;”使用数据库wpw20171121。

  输入“create table user(username VARCHAR(20),password VARCHAR(20));”在数据库中新建一张表user，并设置好表头。

  输入“insert into user values('20171121','11212017');”向表中添加一条数据（即用户名为20171121，密码为11212017）。

  输入“select * from user;”查看表user中的数据。

  输入“create user 'wpw'@'localhost' identified by '20171121';”建立新用户wpw，密码为20171121。

  输入“grant all privileges on wpw20171121.* to 'wpw'@'localhost' identified by '20171121';” 赋予用户wpw在本机登录时对数据库wpw20171121的所有操作权限。

  输入“grant all privileges on wpw20171121.* to 'wpw'@'%' identified by '20171121';” 赋予用户wpw在异地登录时对数据库wpw20171121的所有操作权限。

  输入“flush privileges;”更新权限。

  输入“sudo mysql -u wpw -p wpw20171121”测试新用户。

  输入“show tables;”列出数据库wpw20171121下的表格。

 

  4.4 Web后端：编写PHP网页

  输入“cd /var/www/html”进入Apache目录。

  输入“sudo vim phptest.php”，使用测试代码测试php是否可以正常工作。

  在浏览器中输入“192.168.217.128/phptest.php?a=/etc/passwd”，观察到网页中显示出/etc/passwd中的所有内容，同时最后一行输出了上述代码中设置的“have a try,wpw!”。

  输入“sudo vim login.php”,编写PHP代码并连接MySQL数据库（代码如下图所示）。

  输入“sudo vim 1121test3.html”,新建1121test3.html，在1121test2.html的基础上加入“<form action="login.php" method="GET" id="myForm">”。action参数指定了后台服务器处理这个表单的脚本，或者简单理解为点击提交后显示的页面；method参数如果是GET,后面的输入值会显示在URL中提交，如果是POST则封装到数据包中提交。

  在浏览器中输入“192.168.217.128/1121test3.html”，在表单中填入user表中的用户名和密码。点击登录提交表单后，页面跳转至192.168.217.128/login.php，同时将表单内容显示在URL中。由于所填信息正确，显示登录成功“Welcome login 20171121”。

  当所填信息不正确时，显示登录失败“login failed!!!!”。

 

  4.5 SQL注入，XSS攻击测试

    4.5.1 SQL注入

    以下有两种简单的SQL注入攻击，第一种为在用户名输入框中填入“20171121’--”，密码任意，回车后即可显示登录成功“Welcome login 20171121’--”。这是因为当输入的用户名代入PHP的select语句中时，会变成“select * from user where username='20171121'-- 'and password =''”，--用于将后面的内容注释掉，所以不管密码是否输入正确，都能够成功登陆。

    第二种为在用户名输入框中填入“' or 1=1#”，密码任意，回车后即可显示登录成功“Welcome login ' or 1=1#”。这是因为当输入的用户名代入PHP的select语句中时，会变成“select * from users where username='' or 1=1#' and password =''”，#用于将后面的内容注释掉，而1=1恒真，所以该语句永远成立，不管密码是否输入正确，都能够成功登陆。

    4.5.2 XSS攻击

    在login.php中加入“echo $uname;”。

    将XSS攻击测试图片放入目录/var/www/html下。

    在用户名输入框中输入“<img src="XSS.png"/>”，密码任意，就可以将图片显示到网页中。

五、基础问题回答

  1．什么是表单？

  答：HTML 表单用于搜集不同类型的用户输入。HTML 表单包含表单元素。表单元素指的是不同类型的input元素、复选框、单选按钮、提交按钮等等。

  2．浏览器可以解析运行什么语言？

  答：HTML（超文本标记语言）、XML（可扩展标记语言）以及JavaScript、PHP、Python、ASP等脚本语言。

  3．WebServer支持哪些动态语言？

  答：WebServer支持JSP、PHP、ASP、Ruby等语言。

    JSP（全称Java Server Pages）是由Sun Microsystems公司主导创建的一种动态网页技术标准。JSP部署于网络服务器上，可以响应客户端发送的请求，并根据请求内容动态地生成HTML、XML或其他格式文档的Web网页，然后返回给请求者。JSP技术以Java语言作为脚本语言，为用户的HTTP请求提供服务，并能与服务器上的其它Java程序共同处理复杂的业务需求。

    PHP即“超文本预处理器”，是一种通用开源脚本语言。PHP是在服务器端执行的脚本语言，与C语言类似，是常用的网站编程语言。PHP独特的语法混合了C、Java、Perl以及 PHP 自创的语法。使用广泛，主要适用于Web开发领域。

    ASP即Active Server Pages，是Microsoft公司开发的服务器端脚本环境，可用来创建动态交互式网页并建立强大的web应用程序。当服务器收到对ASP文件的请求时，它会处理包含在用于构建发送给浏览器的HTML网页文件中的服务器端脚本代码。除服务器端脚本代码外，ASP文件也可以包含文本、HTML（包括相关的客户端脚本）和com组件调用。

 

六、实验总结与体会

  通过本次实验，我对Web前端编程中的HTML、CSS和JavaScript的使用方法有了初步的了解，知道了表单的概念，同时编写了不同的HTML网页，放入Apache的工作目录中，从浏览器访问。实验中，我通过编写简单的PHP网页，并与事先配置好的MySQL数据库连接，理解了表单与后台服务器的数据交互方式。

  本次实验令我受益匪浅，期待下次实验能让我对这门课程有更深的理解和感悟。