导言: 本博客将向您展示如何构建一个带有登录系统的猜数字游戏。我们将使用Java Servlet和JSP来实现这两个功能,结合用户认证和互动游戏。
步骤1:项目设置
首先,创建一个Java Web项目,并确保包括Servlet和JSP支持。
步骤2:登录系统
在login.jsp
页面中,建立一个简单的登录表单,允许用户输入用户名和密码。
<html>
<head>
<title>Login Page</title>
<script type="text/javascript">
// Check if errorMessage attribute exists
var errorMessage = "${errorMessage}";
if (errorMessage && errorMessage.trim() !== "") {
// Display the error message
var errorDiv = document.createElement("div");
errorDiv.innerHTML = errorMessage;
errorDiv.className = "error-message";
document.body.appendChild(errorDiv);
// Automatically hide the error message after 3 seconds (adjust the time as needed)
setTimeout(function () {
errorDiv.style.display = "none";
}, 3000);
}
</script>
</head>
<body>
<%-- Check if errorMessage attribute exists --%>
<%
String errorMessage = (String) request.getAttribute("errorMessage");
if (errorMessage != null && !errorMessage.isEmpty()) {
%>
<div class="error-message"><%= errorMessage %></div>
<%
}
%>
<form method="post" action="loginServlet">
<label for="username">Username:</label>
<input type="text" id="username" name="username" required><br><br>
<label for="password">Password:</label>
<input type="password" id="password" name="password" required><br><br>
<input type="submit" value="Login">
</form>
</body>
</html>
接着,在LoginServlet
中,验证用户的登录凭证。如果登录成功,则跳转到猜数字游戏页面。
import java.io.IOException;
import static java.lang.System.out;
@WebServlet("/loginServlet")
public class LoginServlet extends HttpServlet {
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws IOException, ServletException {
String username = request.getParameter("username");
String password = request.getParameter("password");
UserValidator validator = new UserValidator();
if (validator.validateUser(username, password)) {
// 登录成功,重定向到dashboard.jsp
response.sendRedirect("c1.jsp");
} else {
if (!validator.validateUser(username, password)) {
request.setAttribute("errorMessage", "登录失败!");
request.getRequestDispatcher("login.jsp").forward(request, response);
}
response.sendRedirect("login.jsp");
}
}
}
在代码中,如果用户登录成功,使用response.sendRedirect("c1.jsp")
将用户重定向到c1.jsp——
猜数字游戏页面。如果登录失败,使用request.setAttribute("errorMessage", "登录失败!")
将错误消息存储在request
对象中,然后使用request.getRequestDispatcher("login.jsp").forward(request, response);
将用户跳转回login.jsp
,同时传递了错误消息。
步骤3:生成随机数字
在c1.jsp
页面中,生成一个1到100的随机数字,并将其存储在用户的session
对象中。
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ page import="java.util.Random" %>
<%@ page import="java.io.PrintWriter" %>
<%
Random random = new Random();
int targetNumber = random.nextInt(100) + 1;
session.setAttribute("targetNumber", targetNumber);
session.setAttribute("attempts", 0);
%>
<html>
<head>
<title>猜数字游戏</title>
</head>
<body>
<h1>欢迎来到猜数字游戏</h1>
<p>我已经选择了一个 1 到 100 之间的随机数。</p>
<p><a href="guess.jsp">去猜这个数</a></p>
</body>
</html>
步骤4:用户猜测
在guess.jsp
页面中,用户可以提交他们的数字猜测。
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%
int targetNumber = (int) session.getAttribute("targetNumber");
int attempts = (int) session.getAttribute("attempts");
int guess = 0;
String message = "";
if (request.getParameter("guess") != null) {
guess = Integer.parseInt(request.getParameter("guess"));
attempts++;
if (guess > targetNumber) {
message = "您猜大了!这是第 " + attempts + " 次猜测。";
} else if (guess < targetNumber) {
message = "您猜小了!这是第 " + attempts + " 次猜测。";
} else {
message = "您猜对了!这是第 " + attempts + " 次猜测。";
}
}
session.setAttribute("attempts", attempts);
%>
<html>
<head>
<title>猜数字游戏</title>
</head>
<body>
<h1>猜数字游戏</h1>
<p><%= message %></p>
<form action="guess.jsp" method="post">
<p>您的猜测:<input type="text" name="guess" /></p>
<p><input type="submit" value="提交猜测" /></p>
</form>
<p><a href="c1.jsp">重新获得随机数</a></p>
</body>
</html>
进入guess.jsp页面后,我们将使用session
对象来跟踪用户的猜测次数,并提供有关他们的猜测的反馈。如果猜对了,显示“您猜对了”并显示猜测次数。如果猜大了,显示“您猜大了”和次数,反之亦然。
结论:
通过本博客,我们展示了如何创建一个令人兴奋的猜数字游戏,并添加了用户登录系统以进行身份验证。这个项目结合了Web开发的两个核心概念:用户身份验证和用户互动,是一个很好的Java Web开发练习。