20232327 2025-2026-1 《网络与系统攻防技术》实验八实验报告
20232327 2025-2026-1 《网络与系统攻防技术》实验八实验报告
1.实验内容
1.1 本周学习内容
-
掌握数据库基本操作与安全防护：学习了MySQL的基本操作，像创建数据库、管理用户和表的相关操作都已掌握。同时深入了解SQL注入原理，清楚如何通过SQL注入绕过登录验证，比如利用' OR 1=1 --这样的注入语句就能实现登录绕过，也明晰了普通注入与盲注入的区别。此外，还掌握了使用预处理语句（如PreparedStatement）这一有效防止SQL注入攻击的方法。
-
了解XSS攻击原理与前端核心内容：明确前端主要负责页面展示和交互，所使用的技术包括HTML、CSS、JS。同时学习了XSS攻击原理，知晓通过注入恶意脚本可获取用户信息，例如在输入框中注入就能执行脚本，并且掌握了用输出编码和输入过滤来防止XSS攻击的方法。
-
复习前后端区别与编程语言特点：清楚后端负责数据处理和业务逻辑，使用Java、Python等语言，前端则聚焦页面与交互。还理解了前后端编程语言的特点，比如Java适合大型企业应用后端，JavaScript主要用于前端开发，二者在语法、运行环境和应用场景上有着显著差异。
1.2 实验内容及要求
(1)Web前端HTML
能正常安装、启停Apache。理解HTML，理解表单，理解GET与POST方法，编写一个含有表单的HTML。
(2)Web前端javascipt
理解JavaScript的基本功能，理解DOM。
在（1）的基础上，编写JavaScript验证用户名、密码的规则。在用户点击登陆按钮后回显“欢迎+输入的用户名”
尝试注入攻击：利用回显用户名注入HTML及JavaScript。
(3)Web后端：MySQL基础：正常安装、启动MySQL，建库、创建用户、修改密码、建表
(4)Web后端：编写PHP网页，连接数据库，进行用户认证
(5)最简单的SQL注入，XSS攻击测试
(6)安装DVWA或WebGoat平台，并完成SQL注入、XSS、CSRF攻击。
2.实验过程
(1)Web前端HTML
能正常安装、启停Apache。理解HTML，理解表单，理解GET与POST方法，编写一个含有表单的HTML。
2.1.1Apache服务器开启与配置
Apache HTTP Server（简称Apache）是一个功能强大的开源Web服务器，广泛用于托管Web网站。在本实验中，首先通过安装Apache Web服务器来搭建基本的Web服务环境。
kali是自带Apache服务的，做一世界使用命令systemctl start apache2开启Apache服务；
systemctl status apache2.service可以查看Apache服务状态；
systemctl stop apache2停止Apache服务；
配置防火墙
为了确保外部访问，需要通过以下命令调整防火墙规则，允许HTTP流量通过防火墙
sudo ufw allow 'Apache'
验证安装
完成上述配置后，启动Apache服务，打开Firefox浏览器，在URL栏中输入http://localhost， 应该能看到Apache的默认欢迎页面（Apache2 Debian Default Page），表示Web服务器安装成功。
2.1.2HTML表单功能实现
完成Apache服务器配置启动后，我们来编写一个简单的HTML表单前端页面，来帮助我们更好的理解GET和POST方法；
HTML表单是Web开发中最基础的功能之一，它通过表单元素收集用户输入的数据，并将这些数据提交给服务器进行处理。
基础知识理解
-
HTML:HTML（超文本标记语言）是构建网页的标准语言，而表单（form）是 HTML 中用于收集用户输入并提交到服务器的核心组件。表单通过各种控件（如输入框、按钮、下拉菜单）接收用户数据，再通过 HTTP 方法（GET/POST）将数据发送到后端处理。
-
理解表单基本元素及其功能
| 元素标签 | 核心功能 | 关键属性 | 典型使用示例 |
|---|---|---|---|
<form> |
表单容器，定义数据提交规则 | action（提交 URL）、method（GET/POST）、enctype（编码类型） |
html<form action="/submit" method="POST" enctype="multipart/form-data"></form> |
<input type="text"> |
单行文本输入（用户名、邮箱前缀等） | name（后端标识）、placeholder（提示）、maxlength（长度限制）、required（必填） |
html<input type="text" name="username" placeholder="用户名" maxlength="20" required> |
<input type="password"> |
密码输入（内容隐藏） | name、required、minlength（最小长度） |
html<input type="password" name="password" minlength="6" required> |
<input type="email"> |
邮箱输入，浏览器基础格式验证 | name、required、pattern（自定义正则） |
html<input type="email" name="email" required pattern="[a-z0-9]+@[a-z]+\.[a-z]{2,3}"> |
<input type="number"> |
数字输入（年龄、数量等） | name、min（最小值）、max（最大值）、step（步长） |
html<input type="number" name="age" min="18" max="100" step="1"> |
<input type="checkbox"> |
多选框（兴趣、同意协议等） | name（同一组同名）、value（提交值）、checked（默认选中） |
html<input type="checkbox" name="hobby" value="reading" checked> 阅读 |
<input type="radio"> |
单选框（性别、支付方式等） | name（同一组同名）、value、checked（默认选中） |
html<input type="radio" name="gender" value="male" checked> 男 |
<input type="file"> |
文件上传（头像、附件等） | name、accept（限制文件类型）、multiple（多文件上传） |
html<input type="file" name="avatar" accept="image/*" multiple> |
<input type="hidden"> |
隐藏字段（传递 Token、用户 ID 等不可见数据） | name、value（隐藏值） |
html<input type="hidden" name="csrf_token" value="abc123xyz"> |
<input type="submit"> |
提交表单按钮 | value（按钮文字） |
html<input type="submit" value="提交数据"> |
<input type="button"> |
普通按钮（绑定自定义 JS 事件） | value、onclick（点击事件） |
html<input type="button" value="重置" onclick="resetForm()"> |
<textarea> |
多行文本输入（留言、评论等） | name、rows（行数）、cols（列数）、maxlength、placeholder |
html<textarea name="comment" rows="5" cols="30" maxlength="500" placeholder="请输入留言"></textarea> |
<select>+<option> |
下拉选择菜单（地区、学历等） | name、multiple（多选）、size（可见选项数） |
html<select name="city"><option value="">请选择</option><option value="beijing" selected>北京</option></select> |
<label> |
绑定表单控件，提升可用性 | for（关联控件 ID） |
html<label for="username">用户名：</label><input type="text" id="username" name="username"> |
- 理解GET与POST方法
- GET 方法是通过 URL 传递数据，参数可见于地址栏，适用于获取数据，特点是传输长度受限、易缓存但安全性低，数据暴露易被窃取；
- POST 方法则将数据封装在请求体中，不可见，适用于提交数据，无明确长度限制，安全性更高，常用于登录、上传等场景，需配合 HTTPS 进一步保障数据安全。
- 两者核心差异在于数据传输位置与安全性，GET 侧重查询，POST 侧重提交。
| 特性 | GET 方法 | POST 方法 |
|---|---|---|
| 数据传输方式 | 数据附加在 URL 后（查询字符串） | 数据放在请求体中 |
| 可见性 | 数据暴露在 URL 中，可被直接查看 | 数据隐藏在请求体，更安全 |
| 数据长度限制 | 受 URL 长度限制（通常 2KB~8KB） | 无明确限制，可传输大量数据 |
| 缓存与历史记录 | 请求会被缓存，记录在历史记录中 | 不会被缓存，无历史记录残留 |
| 用途 | 用于获取数据（如搜索、查询） | 用于提交数据（如登录、注册、上传） |
2.1.3编写一个有POST和GET方法的HTML表单
首先，进入/var/www/html/路径；
cd /var/www/html/
创建名为GET_POST.html的文件，并将下面的代码添加到文件中；
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<title>表单示例 - 网络攻防实验(20232327ywx)</title>
<style>
body { font-family: Arial, sans-serif; max-width: 500px; margin: 2rem auto; padding: 0 1rem; }
.form-group { margin-bottom: 1rem; }
label { display: block; margin-bottom: 0.5rem; }
input { width: 100%; padding: 0.5rem; box-sizing: border-box; }
button { padding: 0.7rem 1.5rem; background: #007bff; color: white; border: none; border-radius: 4px; cursor: pointer; }
button:hover { background: #0056b3; }
.form-container { border: 1px solid #ddd; padding: 2rem; border-radius: 8px; }
</style>
</head>
<body>
<div class="form-container">
<h2>GET方法表单（登录）</h2>
<!-- GET方法：数据会显示在URL中 -->
<form action="/login" method="GET">
<div class="form-group">
<label for="get-username">用户名：</label>
<input type="text" id="get-username" name="username" placeholder="输入用户名" required>
</div>
<div class="form-group">
<label for="get-password">密码：</label>
<input type="password" id="get-password" name="password" placeholder="输入密码" required>
</div>
<button type="submit">提交（GET）</button>
</form>
<hr style="margin: 2rem 0;">
<h2>POST方法表单（登录）</h2>
<!-- POST方法：数据在请求体中 -->
<form action="/login" method="POST">
<div class="form-group">
<label for="post-username">用户名：</label>
<input type="text" id="post-username" name="username" placeholder="输入用户名" required>
</div>
<div class="form-group">
<label for="post-password">密码：</label>
<input type="password" id="post-password" name="password" placeholder="输入密码" required>
</div>
<button type="submit">提交（POST）</button>
</form>
</div>
</body>
</html>
使用GET提交表单，可以在URL栏中显示我的用户名和密码；
使用POST方法提交表单，不会在URL中显示，更加安全；
(2)Web前端javascipt
2.2.1基础知识理解
- JavaScript 是 Web 前端的脚本语言，用于实现页面交互逻辑（如表单验证、动态效果、数据请求），可直接嵌入 HTML 并运行在浏览器端；
- DOM（文档对象模型）是浏览器将 HTML 文档解析成的树形对象结构，JavaScript 通过 DOM API（如获取元素、修改内容 / 样式、绑定事件）操作页面元素，实现 “动态操控网页” 的核心能力。
- 简言之，JavaScript 是 “行为” 的实现者，DOM 是其操作网页的 “接口桥梁”。
2.2.2使用JavaScript验证用户名、密码
在上面代码的基础上，编写script部分语句如下，要求实现账号和密码都不能为空，且密码长度不能少于8位；
<script>
// 验证GET表单
function validateGetForm() {
const username = document.getElementById('get-username').value.trim();
const password = document.getElementById('get-password').value.trim();
const usernameError = document.getElementById('get-username-error');
const passwordError = document.getElementById('get-password-error');
let isValid = true;
// 重置错误提示
usernameError.style.display = 'none';
passwordError.style.display = 'none';
// 验证用户名
if (!username) {
usernameError.style.display = 'block';
isValid = false;
}
// 验证密码
if (!password || password.length < 8) {
passwordError.style.display = 'block';
isValid = false;
}
return isValid;
}
测试密码长度小于8位，输出提示；
测试账号为空，输出提示；
2.2.3尝试注入攻击：利用回显用户名注入HTML及JavaScript
利用回显注入HTML，直接在用户名栏中输入
<h1>20232327注入测试成功！</h1>
利用事件属性（绕过标签拦截）
输入：
<img src=x onerror=alert('学号20232327-注入成功')>
利用 DOM 事件（如鼠标悬浮）
输入：
<div onmouseover="alert('悬浮触发注入')">20232327测试</div>
利用能触发执行的内联事件（如onerror/onload），将页面劫持代码写在事件中：
<img src=x onerror="document.body.innerHTML='<h1>20232327 页面被劫持</h1>'">
onerror是<img>标签的原生事件，图片加载失败时会直接执行事件内的 JS 代码，不受<script>标签执行限制的影响，能直接修改页面 DOM。
(3)Web后端：MySQL基础：正常安装、启动MySQL，建库、创建用户、修改密码、建表
kali自带有mysql，不需要安装，所以直接使用命令systemctl start mysql启动mysql服务；
在启动mysql服务后，在命令行中输入sudo mysql登录进入MYSQL命令行，登录成功后，如图所示：
之后的操作，我们需要用到一些常用的mysql命令；
mysql数据库常用命令
| 功能分类 | 命令 | 说明 |
|---|---|---|
| 数据库操作 | 1. SHOW DATABASES; |
查看所有数据库 |
2. CREATE DATABASE 数据库名; |
创建数据库，如CREATE DATABASE test_db; |
|
3. USE 数据库名; |
切换到指定数据库，如USE test_db; |
|
4. DROP DATABASE 数据库名; |
删除数据库（谨慎操作） | |
| 表操作 | 1. SHOW TABLES; |
查看当前数据库下的所有表 |
2. CREATE TABLE 表名(字段1 类型, 字段2 类型); |
创建表，如CREATE TABLE user(id INT, name VARCHAR(20)); |
|
3. DESC 表名; |
查看表结构 | |
4. ALTER TABLE 表名 ADD 字段 类型; |
新增表字段，如ALTER TABLE user ADD age INT; |
|
5. DROP TABLE 表名; |
删除表（谨慎操作） | |
| 数据操作（增删改查） | 1. INSERT INTO 表名(字段1,字段2) VALUES(值1,值2); |
插入数据，如INSERT INTO user(id,name) VALUES(1,'Alice'); |
2. SELECT * FROM 表名; |
查询表中所有数据；可加条件：SELECT * FROM user WHERE id=1; |
|
3. UPDATE 表名 SET 字段=新值 WHERE 条件; |
修改数据，如UPDATE user SET name='Bob' WHERE id=1;（需加 WHERE 条件） |
|
4. DELETE FROM 表名 WHERE 条件; |
删除数据，如DELETE FROM user WHERE id=1;（需加 WHERE 条件） |
创建数据库和用户
在mysql命令行中，先创建一个名为20232327db的数据库；
并创建用户20232327，将创建的新数据库的所有权限授予创建的用户；
完成后重新刷新权限使其生效；
#创建数据库
create database 20232327db;
#使用数据库
use 20232327db
#创建用户
create user '20232327' identified by 'Ywx2327';
#授予权限
grant all privileges on 20232327db.* to '20232327';
#刷新权限
FLUSH PRIVILEGES;
创建表并插入数据
#展示表
show tables;
#创建表
CREATE TABLE ywx (id INT AUTO_INCREMENT PRIMARY KEY,
name VARCHAR(255) NOT NULL,pwd VARCHAR(255) NOT NULL);
#查看表结构
describe ywx;
#插入数据
INSERT INTO ywx (name, pwd) VALUES ('20232327ywx', 'test2327');
#查看表内容
SELECT * FROM ywx;
(4)Web后端：编写PHP网页，连接数据库，进行用户认证
kali自带PHP，所以这里直接编写使用PHP代码；
数据库连接文件（db_connect.php）：
<?php
// 数据库配置
$servername = "localhost"; // MySQL服务器地址
$username = "20232327"; // 你的MySQL用户名
$password = "Ywx2327"; // 你的MySQL密码
$dbname = "20232327db"; // 数据库名
// 创建连接
$conn = new mysqli($servername, $username, $password, $dbname);
// 检查连接
if ($conn->connect_error) {
die("数据库连接失败: " . $conn->connect_error);
}
?>
登录处理文件（login.php）（处理 GET/POST 请求的用户认证逻辑）
<?php
// 引入数据库连接
require_once 'db_connect.php';
// 初始化提示信息
$message = "";
// 检查是否有表单提交
if ($_SERVER["REQUEST_METHOD"] == "GET" || $_SERVER["REQUEST_METHOD"] == "POST") {
// 获取表单数据（兼容GET和POST）
$username = isset($_REQUEST['username']) ? trim($_REQUEST['username']) : '';
$password = isset($_REQUEST['password']) ? trim($_REQUEST['password']) : '';
// 简单验证
if (empty($username) || empty($password)) {
$message = "用户名和密码不能为空！";
} else {
// 从数据库查询用户（注意：实际项目需用预处理语句防SQL注入）
$sql = "SELECT * FROM ywx WHERE name = '$username' AND pwd = '$password'";
$result = $conn->query($sql);
if ($result->num_rows > 0) {
// 登录成功
$message = "登录成功！欢迎您，$username";
} else {
// 登录失败
$message = "用户名或密码错误！";
}
}
}
// 关闭连接
$conn->close();
?>
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<title>登录结果 - 网络攻防实验</title>
<style>
body { font-family: Arial, sans-serif; max-width: 500px; margin: 2rem auto; padding: 0 1rem; }
.result { padding: 2rem; border: 1px solid #ddd; border-radius: 8px; text-align: center; }
</style>
</head>
<body>
<div class="result">
<h2><?php echo $message; ?></h2>
<p><a href="GET_POST_php.html">返回登录页</a></p>
</div>
</body>
</html>
相应修改前端的http文件，将前端页面中
浙公网安备 33010602011771号