梁恒嘉的技术专栏 全栈之路

Servlet初体验

2022-07-27
NanKe

Servlet保姆级使用过程,完整记录Servlet的创建和使用,包括IDE使用过程,创建JavaWeb程序过程分析;前后端分离项目最基本模板

前言

提示:本文要记录的大概内容

创建一个JavaWeb程序,并记录Servlet相关知识。


提示:以下是本篇文章正文内容

一、Servlet是什么?

Servlet是接收用户请求,并调用Java程序去处理用户请求,将处理结果返回给用户。通俗的讲是前端发送请求到服务器,服务器根据请求去处理,并返回处理结果。

二、Servlet创建和使用

1.创建一个类继承javax.servlet.http包下的HttpServlet

2.在web.xml文件中配置Servlet

3.运行Servlet程序

通过浏览器访问http:localhost:8080/ 项目名/配置的url

1.Servlet具体创建

我们首先通过IDEA创建一个普通的Java项目,此时的Java项目是一个普通的JavaSE项目。我们需要将其转换为JavaEE项目。第一步:选中项目名称,右击鼠标选择Add Framework Support…;第二步:选中JavaEE,点击OK。此时的项目已经变成了一个JavaEE项目。


第一步如图所示:

在这里插入图片描述

第二步如图所示:

在这里插入图片描述


开始创建处理前端请求的Servelet类,我写一个具体的代码示例:

前端页面是form表单,里面包括用户名与密码参数,后端接受用户名与密码参数,并对其做出响应。当我们提交表单数据的时候可以使用get与post方法,我分别在Servlet中做出处理。


提出问题:

当我们的前端页面发出请求,需要后端进行处理的时候,我们的后端程序通过什么机制获取到前端请求,又通过什么机制对获取到的请求进行处理。


分析与解决问题:

我们的前端页面通过浏览器将数据发送到服务器,服务器这边通过web服务器程序接受到web请求。然后使用(根据Java定义的处理规范)自己的处理类库去处理用户的Servlet。我们之间定义的Servlet类只是一个普通类,我们必须去继承类或者实现接口去和web服务器绑定在一起。然后重写某些处理方法去实现自己的请求处理逻辑。


具体操作:

1:在src目录下创建Servlet包,之后创建自己的LoginServlet类并继承HttpServlet(我们将处理http请求,所以我们继承了HttpServlet类)。

重写HttpServlet中的一些重要方法如下:

    //这是一个空参构造器,Servlet会在创建的时候调用
    //Servlet默认是懒加载,当我们的Servlet被访问的时候才会创建Servlet对象,并且使用的是单例模式
    public LoginServlet() {
    }

    //这个方法会判断get请求与post请求,从而让程序去执行doGet或者doPost方法
    @Override
    protected void service(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
        super.service(req, resp);
    }

    //这个方法是初始化方法,初始化Servlet的操作在这个方法里面执行
    @Override
    public void init(ServletConfig config) throws ServletException {
        super.init(config);
    }

    //这个方法是执行Servlet销毁时需要执行的操作
    @Override
    public void destroy() {
        super.destroy();
    }
    
    //获取get请求,并进行处理
	@Override
    protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws 		ServletException, IOException {

    }

	//获取post请求,并进行处理
    @Override
    protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
    }

我们此时需要分别对get请求与post请求做出处理。所以我们只需要重写HttpServlet中的doGet与doPost方法就可以。

完整代码如下:

public class LoginServlet extends HttpServlet {

    //获取get请求,并进行处理
    @Override
    protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {

        response(req, resp);
    }

    //获取post请求,并进行处理
    @Override
    protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
        //post方法请求需要设置后端解码方式,避免乱码,一般使用utf-8解码中文
        //get方法请求不存在这个问题
        req.setCharacterEncoding("utf-8");
        response(req, resp);
    }

    private void response(HttpServletRequest req, HttpServletResponse resp) throws IOException {
     //getParameter这个方法是通过前端页面中DOM元素的name值去获取数据
        String account = req.getParameter("account");
        System.out.println(account);
        String password = req.getParameter("password");
        System.out.println(password);
        
        resp.setContentType("text/html;charset=utf-8");
        PrintWriter writer = resp.getWriter();
        boolean flag = false;
        if (account.equals("18829463191") && password.equals("18829463191")) {
            flag = true;
        }
        writer.print(flag);
    }
}

此时我们已经将后端处理逻辑完工。我们现在关注前端请求,前端请求是通过form表单提交数据,在form表单里面我们必须为需要提交数据的DOM元素设置name属性(这个name属性就是我的完整代码response方法里面的getParameter方法的参数值)。

具体代码如下:

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title>JavaWeb程序</title>
    <style>
        #form_box {
            position: absolute;
            top: 50%;
            left: 50%;
            margin-left: -250px;
            margin-top: -50px;
        }
    </style>
</head>
<body>
<div id="form_box">
    <form action="http://localhost:8080/JavaWeb/login" method="post">
        账户:<input type="text" name="account" /><br/>
        密码:<input type="text" name="password" /><br/>
        <input type="submit" value="登录" />
    </form>
</div>
</body>
</html>

现在我们的所有代码已经完工。我们现在需要去运行Servlet程序。我们此时就需要使用Tomcat。


2.Servlet程序运行

主要是配置Tomcat,具体配置如图所示:

在这里插入图片描述

在这里插入图片描述

在这里插入图片描述

在这里插入图片描述

在这里插入图片描述

在这里插入图片描述


上一篇 Vue2基本知识

 

Content