《web应用技术》第一次课后练习

小金牛piano

已于 2024-04-04 22:39:38 修改

阅读量536

点赞数 7

文章标签：前端 java 开发语言

于 2024-04-04 21:58:34 首次发布

本文链接：https://blog.csdn.net/m0_74924408/article/details/137380204

版权

本文介绍了如何在记事本中编写并使用JSP创建HTML表单，包括获取用户输入、实现用户姓名、性别选择以及爱好选项，并展示了如何在JSP中进行用户登录验证，包括错误处理和会话管理。

摘要由CSDN通过智能技术生成

一、用记事本编写jsp文件（输出九九乘法表）

二、在IDEA中运行jsp页面

默认打开Hello World!

输出九九乘法表

三、JSP编程练习

（1）用JSP实现用户获取用户输入的操作

input:

<%--
  Created by IntelliJ IDEA.
  User: Administrator
  Date: 2024/4/4
  Time: 22:07
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title></title>
</head>
<body>
<form action="output.jsp" method="post">
    <table border="1px solid" frame="void">
        <tr>
            <td>
                姓名：
            </td>
            <td>
                <input type="text" name="name">
            </td>
        </tr>
        <tr>
            <td>
                性别：
            </td>
            <td>
                <input type="radio" name="sex" value="男">男
                <input type="radio" name="sex" value="女">女
            </td>
        </tr>
        <tr>
            <td>
                爱好：
            </td>
            <td>
                <div>
                    <input type="checkbox" name="like" value="篮球">篮球
                    <input type="checkbox" name="like" value="旅游">旅游
                    <input type="checkbox" name="like" value="音乐">音乐
                    <input type="checkbox" name="like" value="摄影">摄影
                </div>
            </td>
        </tr>
        <tr>
            <td>
                E-mail:
            </td>
            <td>
                <input type="text" name="E-mail">
            </td>
        </tr>
        <tr>
            <td>

            </td>
            <td>
                <input type="submit" value="Submit">
                <input type="reset" value="全部重写">
            </td>
        </tr>
    </table>
</form>
</body>
</html>

output:

<%--
  Created by IntelliJ IDEA.
  User: Administrator
  Date: 2024/4/4
  Time: 22:07
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" import="java.util.*" pageEncoding="GB18030"%>
<html>
<head>
    <title></title>
</head>
<body>
<table border="1px solid" frame="void">
    <tr>
        <td>
            姓名：
        </td>
        <td>
            <%=new String(request.getParameter("name").getBytes("ISO-8859-1"),"UTF-8")%>
        </td>
    </tr>
    <tr>
        <td>
            性别：
        </td>
        <td>
            <%=new String(request.getParameter("sex").getBytes("ISO-8859-1"),"UTF-8")%>
        </td>
    </tr>
    <tr>
        <td>
            爱好：
        </td>
        <td>
            <%
                String []like= request.getParameterValues("like");
                for(int i=0;i< like.length;i++){
            %>
            <%=new String(like[i].getBytes("ISO-8859-1"),"UTF-8")+"&nbsp;"%>
            <%
                }
            %>
        </td>
    </tr>
    <tr>
        <td>
            E-mail:
        </td>
        <td>
            <%=new String(request.getParameter("E-mail").getBytes("ISO-8859-1"),"UTF-8")%>
        </td>
    </tr>

</table>
</body>
</html>

运行效果：

点击“Submit"：

点击“全部重写”：

(2)用JSP实现用户登录验证的功能

<%--
  Created by IntelliJ IDEA.
  User: Administrator
  Date: 2024/4/4
  Time: 22:16
  To change this template use File | Settings | File Templates.
--%><%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>Login</title>
</head>
<body>
<%
    String errorMessage = "";
    if (request.getParameter("error") != null) {
        if (request.getParameter("error").equals("credentials")) {
            errorMessage = "用户名或密码错误";
        } else if (request.getParameter("error").equals("illegal")) {
            errorMessage = "非法访问";
        }
    }
%>
<% if (!errorMessage.isEmpty()) { %>
<p style="color: red;"><%= errorMessage %></p>
<% } %>
<form action="validate_login.jsp" method="post">
    用户名: <input type="text" name="username" /><br/>
    密码: <input type="password" name="password" /><br/>
    <input type="submit" value="登录" />
</form>
</body>
</html>

validate_login.jsp:

<%--
  Created by IntelliJ IDEA.
  User: Administrator
  Date: 2024/4/4
  Time: 22:26
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ page import="java.util.HashMap" %>
<%@ page import="java.util.Map" %>
<%
    String username = request.getParameter("username");
    String password = request.getParameter("password");

    
    Map<String, String> users = new HashMap<>();
    users.put("tom", "tom");

    if (username != null && password != null && users.containsKey(username) && users.get(username).equals(password)) {
        session.setAttribute("username", username); // 登录成功，设置session
        response.sendRedirect("protected1.jsp"); // 重定向到受保护页面
    } else {
        response.sendRedirect("login.jsp?error=credentials"); // 登录失败，重定向回登录页
    }
%>

protected1.jsp:

<%--
  Created by IntelliJ IDEA.
  User: Administrator
  Date: 2024/4/4
  Time: 22:26
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>Protected Page</title>
</head>
<body>
<%
    String username = (String) session.getAttribute("username");
    if (username == null) {
        // 未登录，重定向到登录页面
        response.sendRedirect("login.jsp?error=illegal");
    } else {
%>
<h2>欢迎 <%= username %>!</h2>
<p>这是受保护的页面。</p>
<%
    }
%>
</body>
</html>

运行效果：