Servlet表单提交、前后端数据交换、页面跳转

发布于:2022-11-09 ⋅ 阅读:(6) ⋅ 点赞:(0) ⋅ 评论:(0)

🌟有这么一个实验任务:

(1)要求写一个html页面,其中包含表单,需要输入学号和密码,并且有提交和重置按钮

(2)建立一个Student实体类来辅助数据的传输

(3)在点击提交按钮后页面将携带着数据跳转到另一页面,并完成数据的展示

显而易见的,这个实验包含了Servlet表单提交、前后端数据交换、页面跳转等操作。别急,我们按流程一步步的实现。


🌟第一步:创建input.html页面中的表单

<form action="/formServlet" method="post" >
    <label>学号</label><input name="sno" id="sno"><br>
    姓名<input name="name" id="name"><br>
    <input type="submit" value="提交" >
    <input type="reset" value="重置" ">
</form>

对于其中的<form action="/你要运行的servlet" method="post"

(1)action后面的参数代表:当我们按下提交按钮后程序会执行 " /你要运行的servlet " 应映射到的Servlet类

(2)method后面的参数一般是post或者get。post相对于更加安全,如果使用了get那么输入的信息会直接显示在src中

(3)我们在最后两个input中指定了他们分别是submit/reset,所以他们已经对应有自己的原生处理操作

🌟第二步:编写Student实体类

public class Student {
    private String sno = null;
    private String name = null;

    public String getSno() {
        return sno;
    }

    public void setSno(String sno) {
        this.sno = sno;
    }

    public String getName() {
        return name;
    }

    public void setName(String name) {
        this.name = name;
    }
}

需要包含getter和setter方法,用来存取数据 

🌟第三步 :编写input.html中启用的formServlet类

别急,慢慢来,这一步是重点! 

public class StudentServlet extends HttpServlet{
    @Override
    protected void doGet(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {
        String name = request.getParameter("name");
        String sno = request.getParameter("sno");
        Student student = new Student();
        student.setName(name);
        student.setSno(sno);
        //把完成初始化的student对象保存在session中,使得前端可以拿到这个student对象
        request.getSession().setAttribute("student", student);
        //跳转到页面
        request.getRequestDispatcher("/showStudentInfo").forward(request, response);
    }
    @Override
    protected void doPost(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {
        doGet( request, response);
    }
}

我们在处理表单的时候分为以下步骤:

(1) 我们需要继承HttpServlet并重写其中的doPost和doGet方法,因为我们在表单中选择的提交method是post,所以我们需要使用doPost调用doGet来完成操作

(2)通过String name = request.getParameter("name");来获取表单中输入名为name的数据,通过String sno = request.getParameter("sno");来获取表单中输入名为sno的数据

(3)利用request.getSession().setAttribute("student", student);完成初始化的student对象保存在session中,使得前端可以拿到这个student对象

(4)利用request.getRequestDispatcher("/showStudentInfo").forward(request, response);实现页面的跳转并且将request和reponse一起传过去实现数据的传输(因为student在session中,session在request中)

(5)补充第四点,跳转到的页面是映射路径为("/showStudentInfo")的页面

啊,那这里又有人要问啦,不是说formServlet类吗?你怎么编写了一个StudentServlet类!

没错,我是编写的StudentServlet类,但是实际上html表单对应的 action:/formServlet 是路径名,程序看到你提交了表单之后会去映射表中找路径名对应的映射名再去对应的类,所以我们只需要将映射名写成formServlet就好了。

🌟第四步:编写信息显示页面

public class showStudentInfo extends HttpServlet {
    @Override
    protected void doPost(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {
        Student student = (Student)request.getSession().getAttribute("student");
        response.setContentType("text/html;charset=gb2312");
        PrintWriter out = response.getWriter();
        out.println("<html><body>");
        out.println( "学号"+student.getSno()+"<br>");
        out.println( "姓名"+student.getName()+"<br>");
        out.println("</body></html>");
    }
}

我们从request中向下转型拿到了student然后使用PrintWriter实现页面的输出。 

🌟第五步:web.xml的配置编写

上面的命名你可能有疑惑,在这一步会解释命名的作用以及程序读取命名的流程。 

其实我们实现了两个servlet,一个用来读取表单并跳转,另一个用来显示数据。所以我们总共会有两个servlet标签和两个servlet-mapping(映射)的标签。

子标签中servlet-name的作用是让url-pattern找的到servlet-class,url-pattern才是前端表单action的查找对象。

比如:当前端查找/formServlet,他找到了/formServlet之后发现他的servlet-name是formServlet。进而查找到formServlet对应的类是com.example.bookstore.StudentServlet,从而再去运行这个类。

    <servlet>
        <servlet-name>formServlet</servlet-name>
        <servlet-class>com.example.bookstore.StudentServlet</servlet-class>
    </servlet>
    <servlet-mapping>
        <servlet-name>formServlet</servlet-name>
        <url-pattern>/formServlet</url-pattern>
    </servlet-mapping>
    <servlet>
        <servlet-name>showStudentInfo</servlet-name>
        <servlet-class>com.example.bookstore.showStudentInfo</servlet-class>
    </servlet>
    <servlet-mapping>
        <servlet-name>showStudentInfo</servlet-name>
        <url-pattern>/showStudentInfo</url-pattern>
    </servlet-mapping>

 

 

  End Of The Paper