Exp8：Web基础
一、实验要求
1.Web前端HTML
能正常安装、启停Apache。理解HTML，理解表单，理解GET与POST方法,编写一个含有表单的HTML。
2.Web前端javascipt
理解JavaScript的基本功能，理解DOM。编写JavaScript验证用户名、密码的规则。
3.Web后端：MySQL基础：正常安装、启动MySQL，建库、创建用户、修改密码、建表
4.Web后端：编写PHP网页，连接数据库，进行用户认证
5.最简单的SQL注入，XSS攻击测试
二、实验步骤
一）、Web前端HTML
1、卡里默认安装好了apache，我们直接启动服务即可 service apache2 start 没有提示就说明正常，然后在浏览器输入127.0.0.1，能打开默认网页说明服务没问题
2、 cd /var/www/html 进入apache目录下， vim simple_form.html 创建并编写一个含有简单表单的html文件，内容如下：
<html>
<head>
<title>Login</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
</head>
<body>
<h2 align="center">Login</h2>
<center>
<form action="login" method="post">
<input placeholder="E-mail" name="Name" class="user" type="email">
<br> </br>
<input placeholder="Password" name="Password" class="pass" type="password">
<br> </br>
<input type="submit" value="Login">
</form>
</center>
</body>
</html>
3、在浏览器中输入/var/www/html/simple_form.html 打开该网页
二）、Web前端javascript
1、在前面的代码基础上加上一段javascript代码来判断用户和密码是否填写，代码入下login_test.html：
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>login</title>
<script type="text/javascript">
function resetValue(){
document.getElementById("username").value="";
document.getElementById("password").value="";
}
</script>
</head>
<body>
<div align="center" style="padding-top: 50px;">
<form action="login5127.php" method="GET" name="login" >
<table width="740" height="300" >
<td colspan="2"></td>
</tr>
<tr height="1">
<td width="40%"></td>
<td width="5%">username：</td>
<td><input type="text" value="input your name" name="username" id="username"/></td>
<td width="30%"></td>
</tr>
<tr height="1">
<td width="40%"></td>
<td width="5%">password：</td>
<td><input type="password" value="" name="password" id="password"/></td>
<td width="30%"></td>
</tr>
<tr height="1">
<td width="40%"></td>
<td width="5%"><input type="submit" name="login" value="登录"onClick="return Login()" /></td>
<td align="center"><td align="center"><input type="button" name="close" value="关闭" οnclick="window.close();" /></td></td>
<td width="30%"></td>
</tr>
</table>
</form>
</div>
<script language="javascript">
function Login(){
var Name = document.login.username.value ;
var Pwd = document.login.password.value ;
if ((Name =="") ){
alert("user name is NULL!");
return false ;
}
if ((Pwd=="")){
alert("password is NULL!");
return false ;
}
}
</script>
</body>
</html>
2、浏览器访问/var/www/html/login_test.html ，测试没有填写用户名或者密码时登录会怎样提示
三）、MySql基础内容
1、Mysql也是默认装好的我们直接启动即可 /etc/init.d/mysql start
2、mysql -u root -p 登录root用户，密码默认为password
3、show databases; 查看已有的数据库
4、use mysql;使用mysql数据库
5、select user, password, host from user; 查看用户信息
6、update user set password=20175127("新密码") where user='root';修改密码
7、flush privileges; 更新权限
8、exit 退出数据库，重新登录mysql -u root -p
9、create database 数据库名称;新建数据库
10、show databases; 查看已有数据库
11、use dxy; 使用刚刚创建的数据库
12、create table 表名 (字段设定列表); 创建一个登录用户表，用于后面验证登录信息
13、show tables;查看已存表，可以看见刚刚创建的表
14、insert into 表名 values('值1','值2','值3'...); 插入数据
15、select * from 表名; 查询表中数据