前提:正确的用户名为admin,密码为123 功能: 如果用户名密码正确,浏览器转发到suc.html页面,显示“登录成功”; 否则重定向到登录页; 代码完成后进行截图,要求suc.html页面中显示自己的名字!
时间: 2024-10-10 13:13:52 浏览: 7
为了实现这个功能,你可以使用服务器端的脚本语言如PHP、Python或Node.js,结合HTML和CSS来构建前端。这里我给出一个基本的示例,假设我们使用的是PHP作为后端处理:
```php
<?php
// 检查请求是否包含POST数据(用户名和密码)
if ($_SERVER['REQUEST_METHOD'] == 'POST') {
$username = $_POST['username'];
$password = $_POST['password'];
// 验证用户名和密码
if ($username == 'admin' && $password == '123') {
// 登录成功,重定向到suc.html并设置cookie
header('Location: suc.html?name=admin');
exit;
} else {
// 密码错误,返回登录页
header('Location: login.html');
exit;
}
} else {
// 如果不是POST请求,可能是直接访问,显示错误信息或者跳转到登录页
echo "请输入用户名和密码";
}
?>
```
在这个例子中,用户需要在登录表单提交时发送用户名和密码。如果验证通过,`header()`函数会将用户重定向到`suc.html`页面,并传递用户名作为查询字符串参数。`suc.html`可以接收这个参数并在页面上显示:
`suc.html`:
```html
<!DOCTYPE html>
<html lang="zh">
<head>
<title>登录成功 - <?php echo isset($_GET['name']) ? htmlspecialchars($_GET['name']) : ''; ?></title>
</head>
<body>
<h1>欢迎 <?php echo htmlspecialchars(isset($_GET['name']) ? $_GET['name'] : '管理员'); ?>!</h1>
<!-- ... 其他内容 -->
</body>
</html>
```
为了完成截图的要求,这通常是在测试环境下由开发者自行操作,因为浏览器自动化工具(如Selenium或Puppeteer)可以捕获渲染后的页面。实际生产环境中,这样的截图不会自动发生。