基于tomcat的javaweb在线教学网站的开发--完成登录、注册以及考试页面_开发一个简单的在线教学网站系统,要求具备注册功能、登录功能和考试功能。 1)注册-CSDN博客

本文链接：https://blog.csdn.net/kingJamesbond/article/details/121339005

实验目的

1、理解servlet技术的概念与特点；
2、掌握servlet程序开发和调试的方法。

实验内容

开发一个简单的在线教学网站系统，要求具备登录功能、注册和考试功能。
1）注册功能
用户注册页面，供用户输入用户名、密码等信息，然后可以返回到用户登录页面。
2）登录功能
用户登录页面，通过核对用户名和密码确认合法用户身份，用户合法则进入系统（即跳转到考试页面），失败则回到登录页面，让用户重新登录。
3）考试功能
在线考试页面,在本课程选取5题作为考试题目，每题20分，答题完毕计算并显示该次考试的成绩。

个人心得体会

本学期的javaweb课只有13周课（包含实验周），课时短学习的内容也不多，只能学到皮毛的。加上老师上课照读PPT因此，这章不少的理论内容还是靠着这次简单的实验得到了巩固。

个人注册页面的代码以及分析

javaweb主要开发的两个关键文件一个是Java文件,一个是jsp文件我们可以理解为jsp文件就是和前端三件套的html类似的，负责用来表示页面的元素，而Java文件则是需要编写jsp的相关逻辑也就是后端。

<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>注册页面</title>
</head>
<body>
<form action="register.do" method="post">
    账号:<input type="text" name="account"><br>
    密码:<input type="password" name="password"><br>
    <input type="submit" value="注册">
    <input type="reset" value="重置你的账号">
    <a href="login.jsp">点击登录</a>
//这里是后来添加的
</form>
</body>
</html>

页面效果

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-tvLPgvCh-1636968015124)(https://s3-us-west-2.amazonaws.com/secure.notion-static.com/16dac127-70ec-42b8-9f0c-2326236bf551/Untitled.png)]

LoginServlet.Java

package demo;

import java.io.IOException;
import java.io.PrintWriter;

import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

@WebServlet(name="/RegisterServlet",urlPatterns= {"/register.do"})
public class RegisterServlet extends HttpServlet {

    protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        String username=request.getParameter("account");
        String password=request.getParameter("password");
        response.setContentType("text/html;charset=utf-8");
        PrintWriter out=response.getWriter();
        out.println("<html><body>");
        out.println("注册成功");
        response.setHeader("refresh","1;url=login.jsp");
//		每一秒刷新页面
    }

}

个人登录页面

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>用户登录页面</title>
</head>
<body>
<h4>用户登录页面</h4>
<form action="LoginServlet" method="post">
    <%--    action那代写登录后的页面也就是考试系统--%>
    <table>
        <tr>
            <td>用户名:</td>
            <td><input type="text" name="username" size="25"></td></tr>
        <tr>
            <td>密码</td>
            <td><input type="password" name="password" size="25"></td>
        </tr>
        <tr>
            <td>学号</td>
            <td><input type="text" name="学号" size="16"></td>
        </tr>
        <tr>
            <td>
                <input type="submit"name="submit" value="提交">
            </td>
            <td>
                <input type="reset" name="reset" value="重置">
            </td>
        </tr>
    </table>

</form>
</body>
</html>

LoginServlet.java

package demo;
import java.io.*;
import java.net.ResponseCache;

import javax.servlet.*;
import javax.servlet.http.*;
import javax.servlet.annotation.WebServlet;
@WebServlet("/LoginServlet")
public class LoginServlet extends HttpServlet {
    @Override
    protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
        String username= req.getParameter("username");
        String password=req.getParameter("password");
        resp.setContentType("text/html;charset=UTF-8");
        PrintWriter out=resp.getWriter();
        out.println("<!DOCTYPE html>");
        out.println("<html><body>");
        if(username.equals("admin")&&password.equals("admin"))
        {

            req.setAttribute("username",username);
            RequestDispatcher rd=req.getRequestDispatcher("/text.jsp");
            rd.forward(req,resp);
        }
        else {
						
            RequestDispatcher rd=req.getRequestDispatcher("/login.jsp");
            rd.forward(req,resp);
        }
        out.println("</body></html>");
    }
}

功能描述

登录页面如果账号密码都正确则跳转到考试页面进行答题，如果账号密码不正确则会重新回到登录页面。
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-hKO7BTTN-1636968015127)(https://s3-us-west-2.amazonaws.com/secure.notion-static.com/aaddf2a6-8fa7-4d4f-9a3e-a67a3a89c565/Untitled.png)]

如果是正确的会跳转到考试页面

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-b9hDjo1z-1636968015128)(https://s3-us-west-2.amazonaws.com/secure.notion-static.com/589fccb1-8b55-4bee-914c-0886ba903d4f/Untitled.png)]

如果故意设置账号不正确不正确

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-yAEWDUuJ-1636968015128)(https://s3-us-west-2.amazonaws.com/secure.notion-static.com/55dd5180-18ef-4a7e-86f7-1de572f3e649/Untitled.png)]

账号填写错误的时候的效果

考试页面

text.js

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>考试页面</title>
</head>
<body>
<h4>欢迎进入考试界面,祝你考试顺利</h4>
<h1>下面是选择题部分，共五道题,每题20分，总共100分</h1>
1、下面的编程语言不属于面向对象语言的是:
<form action="Text" method="post">
    <input type="radio" name="question1" value="1">C语言
    <input type="radio" name="question1" value="2">java
    <input type="radio" name="question1" value="3">c#
    <input type="radio" name="question1" value="4">python
    <br></br>
    2、下面符合面向对象的特点是：
    <input type="checkbox" name="question2" value="1">封装性
    <input type="checkbox" name="question2" value="2">多态性
    <input type="checkbox" name="question2" value="3">继承性
    <input type="checkbox" name="question2" value="4">抽象
    <br></br>
    3、下面哪个学院属于第一学院
    <input type="radio" name="question3" value="1">电气工程学院
    <input type="radio" name="question3" value="2">粤瓦说唱学院
    <input type="radio" name="question3" value="3">夏园感恩学院
    <input type="radio" name="question3" value="4">英强学院
    <br></br>
    4、请写出下列代码的输出值
    <br></br>
    public class Xiti1 {
    <br></br>
    public static void main(String[] args) {
    <br></br>
    long sum=0,t=1;
    <br></br>
    long result;
    <br></br>
    for(int i=1;i<=10;i++)
    <br></br>
    {
    <br></br>
    t=t*i;
    <br></br>
    sum=sum+t;
    <br></br>
    }
    <br></br>
    System.out.println(sum);
    <br></br>
    }
    <br></br>
    }
    <br></br>

    <input type="text" size="25" name="question4" >
    <br></br>
    5、在关系代数运算中,五种基本运算为:
    <br></br>
    <input type="radio" name="question5" value="1">并、差、交、选择、投影
    <br></br>
    <input type="radio" name="question5" value="2">并、差、选择、投影、自然连接
    <br></br>
    <input type="radio" name="question5" value="3">并、差、选择、投影、乘积
    <br></br>
    <input type="radio" name="question5" value="4">并、差、交、选择、乘积
    <br></br>

    <input type="submit" value="提交">
</form>

</body>
</html>

Text.java

package demo;
import java.io.*;
import java.io.IOException;
import java.security.PublicKey;

import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import javax.servlet.http.HttpSession;
import javax.swing.plaf.basic.BasicInternalFrameTitlePane.IconifyAction;
import javax.swing.text.AbstractDocument.LeafElement;

import com.mysql.cj.protocol.a.result.ResultsetRowsStatic;

import javax.servlet.*;
import java.sql.*;
@WebServlet("/Text")
public class Text extends HttpServlet {
    private static final long serialVersionUID = 1L;
    public static void main(String[] args)
    {

    }
    public void doPost(HttpServletRequest request,HttpServletResponse response)throws ServletException,IOException
    {
        HttpSession session=request.getSession(true);
        response.setContentType("text/htmll+;charset=utf-8");
        String answer1=request.getParameter("question1");
        String answer2[]=request.getParameterValues("question2");
        String answer3=request.getParameter("question3");
        String answer4=request.getParameter("question4");
        String answer5=request.getParameter("question5");
        int score=0;
        if(answer1!=null&&answer1.equals("1"))
        {
            score+=20;
        }
        if(answer2!=null&&answer2.length==4)
        {
            score+=20;
        }
        if(answer3!=null&&answer3.equals("2"))
        {
            score+=20;
        }
        if(answer4!=null&&answer4.equals("55"))
        {
            score+=20;
        }
        if(answer5!=null&&answer5.equals("3"))
        {
            score+=20;
        }
        PrintWriter out=response.getWriter();
        out.println("你的总分:"+score);
        session.setAttribute("score",score);//下一篇博客会用到
       
    }
}

思路分析

考试逻辑是这次实验我认为最难写，因为不知道怎么去写当你选择答案正确的时候分数自增。后来经过查阅课本还有上网查询，需要通过getParameter函数去返回name的参数值，然后该字符串的值和我们jsp页面设置的正确答案的value值匹配，如果正确则分数自增。这里的多选题因为设置的是全选，因此只需要判断返回的字符串数组长度是否为4就可以了

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-Pwf9epgR-1636968015130)(https://s3-us-west-2.amazonaws.com/secure.notion-static.com/3007e7e0-af50-4817-aeff-25297975f2ef/Untitled.png)]
显示分数