Java Web 实战 21 - 用 Servlet 实现一个Hello World

ゞ浴缸里的玫瑰 2024-02-17 09:41 4阅读 0赞

#### 用 Servlet 来写一个 Hello World~ ####

*  一 . 基本部署方式
 *   *  1.1 创建 Servlet 项目
     *  1.2 引入依赖
     *  1.3 创建目录
     *  1.4 编写代码
     *   *  继承 HttpServlet
         *  重写 doGet 方法
         *  删除 super 方法
         *  加上 @WebServlet 注解
         *  写业务逻辑
     *  1.5 打包
     *  1.6 部署
     *  1.7 验证
     *  1.8 小结
 *  二 . 更方便的部署方式
 *   *  2.1 Smart Tomcat 的安装
     *  2.2 Smart Tomcat 的配置
     *  2.3 Smart Tomcat 的使用
     *  2.4 Smart Tomcat 的原理
 *  三 . 常见错误
 *   *  3.1 404
     *  3.2 405
     *  3.3 500
     *  3.4 返回空白页面
     *  3.5 无法访问此网站
     *  3.6 返回中文乱码
 *  四 . 扩展 : 什么是 JSP ?

> Hello , 大家好 , 今天给大家带来的是我们 Java 当中最基础的框架 : Servlet , 那 Servlet 最核心的作用就是用来制作网页端的程序 , 我们通过学习 Servlet 的语法以及相关 API , 就可以写出一些网页程序 .  
>   
> 那这个阶段的程序与之前学习的单机程序不同 , 难度上也加大了 , 代码的题量也更大了 , 这就要求大家跟进脚步 , 不要掉队 , 以练带学 !  
>   
> 博主这篇文章主要给大家讲解一下 怎样创建一个 Servlet 程序并且写出第一个 Servlet 版本的 Hello World  
>   
> 那希望大家跟紧步伐 , 站稳脚跟 !  
> ![在这里插入图片描述][b4e303b4900b449985c5d31a7bc0e3f2.png_pic_center]  
> 大家也可以订阅 [JavaWeb 专栏][JavaWeb] , 点击即可跳转  
>   
> 准备好 , 我们要开始发车了 !

## 一 . 基本部署方式 ##

### 1.1 创建 Servlet 项目 ###

![在这里插入图片描述][f5bbf30789084c3cad397c23a9adca2a.png]  
![在这里插入图片描述][ebb3eb300713478d92f6111e56477b86.png]  
![在这里插入图片描述][507aec8b32e24e279db390019b8f66b3.png]  
![在这里插入图片描述][2887ac82894344b9a08452d32fab57bd.png]

这样就成功创建一个 Servlet 程序了

> 那么 , 我们首先需要了解我们创建的 Maven 是用来干什么的?
> 
> Maven 是一个构建工具 , 我们主要用它来进行依赖管理以及打包 .  
> 我们首次使用 Maven , 可能会出现问题 .  
> 由于 Maven 有很多依赖 , 需要通过网络来加载 , 而 Maven 的服务器是在国外 , 所以咱们下载速度会有点慢 , 30min~1h 都是正常现象  
> 像这种情况 , 就是在下载依赖  
> ![在这里插入图片描述][0f0da204e8b44400ba8031a92c19ce2f.png]

另外 , 其实如果真的下载特别慢 , 可以去尝试修改一下镜像源为国内的镜像源 . 但是轻易不要更改 , 很有可能就改坏了 , 那就不好整了

那么我们来看一下 Servlet 程序的基本构成吧  
![在这里插入图片描述][d855b5b7841e40cf82f98b61ce156279.png]

### 1.2 引入依赖 ###

我们刚才不是提到了依赖了吗 , Maven 里面自己就有依赖啊 ? 咋还导入呢?  
我们这里引入的依赖 , 是写 Servlet 程序 , 需要的依赖 , 也就是 Servlet 的 jar 包  
我们需要把 jar 包下载导入到项目中  
我们之前学习 JDBC 的时候 , 就手动导入过依赖 , 假如依赖比较少 , 我们可以手动导入 , 那依赖要是很多呢?  
我们的 Maven 就可以帮我们自动下载 , 然后导入依赖  
那么怎么弄呢 ?  
我们先要去 Maven中央仓库 下载  
[https://mvnrepository.com/][https_mvnrepository.com]  
刚开始进去会有验证 , 验证一下就可以了  
进来之后就是这样 , 然后搜索 Servlet 即可  
![在这里插入图片描述][31a7b29bcb594dc6be7613dac7cd2e52.png]  
![在这里插入图片描述][24628ae0a21a4e13991b60100a9f5ab1.png]

往下翻 , 找到 3.1.0 (划重点)  
![在这里插入图片描述][360d63aa717746c99146c70c2a67867f.png]

> 我们使用的是 JDK 8 , Tomcat 8.5 , Servlet 3.1 ,这个搭配就是 Tomcat 官方推荐的 , 放心使用

点击之后 , 下面就有个 Maven , 复制下来  
![在这里插入图片描述][e492974de15644589d997f6a07cee401.png]

<dependency>
        <groupId>javax.servlet</groupId>
        <artifactId>javax.servlet-api</artifactId>
        <version>3.1.0</version>
        <scope>provided</scope>
    </dependency>

接下来回到我们的 IDEA , 点击 pom.xml , 在 里面写 标签 , 然后把刚才复制过来的粘贴进去  
![在这里插入图片描述][97c0f280ab334640a48f3226adb25b41.png]

如果以后还有依赖 , 放在 标签里面就行了  
由于我们是第一次使用 , 他爆红了 , 没关系. 他会在中央仓库下载依赖 , 需要一定时间.  
如果没有自动下载的话 , 我们还可以手动刷新一下  
点击右侧的Maven  
![在这里插入图片描述][a90aae2341e74b15a1a83bf44942c17a.png]

点击圆圈按钮  
![在这里插入图片描述][7226c2db6da8424ba32eed6760217205.png]

这样的话 , Maven 就会重新刷新 , 就会继续下载需要的依赖

### 1.3 创建目录 ###

右键 main -> New -> Directory  
![在这里插入图片描述][f4e3984d31a0439994633264545d2837.png]

输入 webapp  
![在这里插入图片描述][a1bfd2c0d17440839826f1eee2d66698.png]

右键 webapp -> New -> Directory  
![在这里插入图片描述][51647826fc2747b2b4f1864ca265dce4.png]

输入 WEB-INF  
然后右键 WEB-INF -> New -> File  
![在这里插入图片描述][c8701587731444608c5c92db51bbb32c.png]

名字叫做 web.xml  
![在这里插入图片描述][3b581d62fba94eb8bcac2c020a7979fa.png]

完事之后就是这个效果  
webapp -> WEN-INF -> web.xml  
![在这里插入图片描述][4431128a84394dad9cc922600386e484.png]

那么这个 web.xml 也不能空着啊 , 现在空着就报错了  
那么我们复制进去这段代码

<!DOCTYPE web-app PUBLIC
            "-//Sun Microsystems, Inc.//DTD Web Application 2.3//EN"
            "http://java.sun.com/dtd/web-app_2_3.dtd" >
    <web-app>
        <display-name>Archetype Created Web Application</display-name>
    </web-app>

> 有的人这里是标红的 , 那也没事.  
> 其实是 IDEA 惯的咱们 , 标红就会认为出错了 . 其实不然 , IDEA 只对 .java 程序特别敏感  
> 在 xml 文件中 , 就很容易出现误报的现象

那么这段代码是什么意思呢 , 我们不需要知道 , 我们只需要知道 tomcat 加载你自己写的程序 , 就会先来读取 web.xml 里面的内容 , 具体读取什么咱们不用管

### 1.4 编写代码 ###

先创建 Java 文件  
![在这里插入图片描述][d13cae3ebc7d4626985dd415c6b90a09.png]

我们的 HelloWorld 程序已经创建好了 , 就长这个样子  
![在这里插入图片描述][d835241c578d43e7b19a11100785da7f.png]

接下来 , 我们需要修改以及增加一些东西

#### 继承 HttpServlet ####

import javax.servlet.http.HttpServlet;
    
    public class HelloWorld extends HttpServlet {
        
    }

我们需要让程序继承 HttpServlet  
![在这里插入图片描述][7d4b758a2d784b62bd98492320273f2d.png]

> 如果发现 HttpServlet 类提示不出来 , 或者手动输入后标红了 , 那就去检查一下刚才的 pom.xml 里面引入的依赖是否成功  
> 未成功的话点击旁边的Maven , 然后上面有个刷新按钮

那么这个 HttpServlet 就来自于我们刚才通过 pom.xml , 基于 Maven 从中央仓库导入的 jar 包

#### 重写 doGet 方法 ####

接下来 , 我们在 HelloWorld 类中重写 doGet 方法  
具体如下图  
![在这里插入图片描述][7ac5422b674e430cb1d68e9ceb050a82.png]

然后代码就变成了这个样子  
![在这里插入图片描述][a9ca9fbaf5584105ba1b6cade315840d.png]

import javax.servlet.ServletException;
    import javax.servlet.http.HttpServlet;
    import javax.servlet.http.HttpServletRequest;
    import javax.servlet.http.HttpServletResponse;
    import java.io.IOException;
    
    public class HelloWorld extends HttpServlet {
        
        @Override
        protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
        
            super.doGet(req, resp);
        }
    }

我们来仔细琢磨琢磨这个 doGet 方法  
![在这里插入图片描述][631f9e7731ac473f92eb374aa44fb824.png]

#### 删除 super 方法 ####

#### 加上 @WebServlet 注解 ####

在完成 doGet 方法之后 , 千万不要忘记在类的上面加上 @WebServlet 注解

这个注解其实就是约定了 HTTP 请求 里面的 URL 里面的 Content-Path 是什么样的 , 才能调用当前这个 Servlet 类

比如 : Tomcat 收到的请求有很多种

*  GET /aaa 不会触发上面的 doGet 方法 , 因为Path不同
 *  GET /bbb 不会触发上面的 doGet 方法 , 因为Path不同
 *  GET /hello 触发 doGet 方法
 *  POST /hello 不会触发上面的 doGet 方法 , 因为这个是 POST 请求  
    所以不是所有的 GET 请求都会触发上面的 doGet 方法 , 只有特定的路径的请求 , 才会触发

根据请求的路径 , 找到对应的类 , 在调用其对应的 doXXX 方法 , 这个过程就是"路由"

> 路由 : 根据不同的路径 , 找到不同的要执行的代码

那么上面的代码我们发现 , 并没有主方法 (main 方法)  
我们之前说 : Java 程序的入口是 main 方法 , 那上面的代码他也没 main 方法 , 那不是执行不了吗 ? 那我们写他干嘛?  
实际上 , 我们的 Servlet 程序是通过 Tomcat 运行的 , 我们可以看作 main 方法是在 Tomcat 里面的 . 所以我们需要部署到 Tomcat 里面才能去运行.

#### 写业务逻辑 ####

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 java.io.IOException;
    
    @WebServlet("/hello")
    public class HelloWorld extends HttpServlet {
        
        @Override
        protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
        
            //把自动生成的super()方法一定要删除掉或者注释掉,不然会有问题
            //super.doGet(req, resp);
    
            //这条语句是打印到服务器的控制台上
            //也就是打印到 IDEA 的控制台上 
            System.out.println("hello");
            
            //这条语句才是添加到响应报文中,显示在页面上
            //就是把"hello world"作为响应报文的body部分了,浏览器就把这个body显示到页面上了
            resp.getWriter().write("hello world");
        }
    }

### 1.5 打包 ###

打包操作十分简单 , 可以通过 Maven 一键式完成  
右边的 Maven -> ServletDemo1 -> Lifecycle -> package  
![在这里插入图片描述][75c9699617b446eaacd9ffbb19246ca1.png]

右键 Run 或者 双击即可进行打包操作  
看到BUILD SUCCESS字样就打包成功了 , 打包失败的话会有报错信息  
![在这里插入图片描述][b9d52c6b08e54b96a661552b8d35884d.png]

我们来分析一下右边结构  
![在这里插入图片描述][0bea89d2cea74b58a2c1a8c2b7b9935e.png]

我们再看 , 这里生成的是 jar 包 , 虽然 jar 包是 Java 语言里面最通用的压缩包 , 但是 Tomcat 就隔路 , 它能识别的是一个 war 包 , 并不支持 jar 包  
![在这里插入图片描述][185d844bf13b4d3e9e7dbd8d76c55f34.png]

所以我们还需要去设置一下  
打开 pom.xml  
在这个位置输入以下代码  
![在这里插入图片描述][97127bdda8d54b4ca97c10da2117608f.png]

<packaging>war</packaging>
    <build>
        <finalName>Hello_servlet</finalName>
    </build>

这个 finalName 同时也是我们在浏览器中输入 URL 的一部分  
![在这里插入图片描述][c90dbdba932a4818bd46e53203489501.png]

注意这两个标签的位置不要写错 , 在的上边  
接下来我们重新打包 , 我们就可以看到 war 包生成成功了  
![在这里插入图片描述][1820f1285d774ff8bdd3cabb4cb11029.png]

我们还可以在文件资源管理器里面查看  
![在这里插入图片描述][01e19a65120b49f497d3b6601da0fc2e.png]  
![在这里插入图片描述][56b9b05d583b4af7aa1090e9092e5995.png]

### 1.6 部署 ###

我们把刚才生成的 war 包 , 拷贝到 Tomcat 里面的 webapps 目录中  
实际上 , 部署就是复制粘贴 , 说得好听其实啥也不是

![在这里插入图片描述][4cdf4cf102e84ec19b3ba2aec5752c53.png]

接下来 , 启动 Tomcat  
![在这里插入图片描述][8e86158e9b374935810400db12b8aaab.png]

还是正常的一堆乱码 , 但是我们往上翻翻 , 就会发现一些蛛丝马迹  
![在这里插入图片描述][e4db73ad5eed48e9899cab1696a40149.png]

意思就是 Tomcat 发现了这个 war 包 , 对他进行解压以及加载了  
我们再回到 webapps 目录里面 , 发现 Hello\_Servlet 已经被解压了  
![在这里插入图片描述][bd9182bfdd4c4eed8569e230a68524b9.png]

### 1.7 验证 ###

我们已经把程序部署在 Tomcat 上了 , 我们接下来可以检验一下了  
在浏览器输入  
[127.0.0.1:8080/Hello\_servlet/hello][127.0.0.1_8080_Hello_servlet_hello]  
我们可以看到 , 已经完美运行了  
![在这里插入图片描述][a9dc119f784848d5b06f214f31fb758e.png]

然后我们来分析一下我们刚刚输入的东西吧  
![在这里插入图片描述][cb4d99c75273488cb80d87f82897ac2c.png]

一般情况下 , 访问 Servlet 程序对应的路径 , 一般是两级路径 , 但是也不绝对  
第一级路径 Context-Path 代表当前的 webapp(网站)

> 一个 Tomcat 上面是可以同时部署多个 webapp (网站)的 , Tomcat 路径底下的 webapps 目录下的每个目录实际上都是一个 webapp (网站)  
>   
> 有的资料也把 Tomcat 叫做 “容器” , 意思就是能容纳多个 webapp

那么一般情况下 ,我们的 Context-Path 怎么确定 ?

1.  如果是通过 startup.bat 启动的 , 那么他的 Context-Path 就是 webapps 目录底下的 war 包 (目录名)
2.  如果是通过 Smart Tomcat 启动的 (稍后介绍) , 那么他的 Context-Path 就是配置启动项的时候那个 Context-Path  
    ![在这里插入图片描述][e16cec25ee1846f4b50b2cb04f153cdb.png]

第二级路径就是 ServletPath , 是根据代码中的 @WebServlet(“/”) 来确定的 , 或者是 webapp下面的静态文件/目录

比如 : 我们在 webapp 路径下面创建个 css 文件夹 , 里面创建个文件 style.css  
![在这里插入图片描述][f47f41ee616649baaa193fecdae8cc55.png]  
运行 Smart Tomcat , 我们输入 URL  
127.0.0.1:8080/MessageWall/css/style.css

什么都没有 , 是因为我们的 CSS 文件没写任何代码![在这里插入图片描述][b8461729c6c149cbada227adb2a6e3a9.png]那么我们刚开始学习 , 可能会出现以下几种情况情况

情况 1 :

![在这里插入图片描述][670d85584e26413ab584c856c34b4007.png]  
404 代表资源 not found 了 , 意思是对应资源要么没找到 , 要么丢了  
遇见 404 , 我们首先要做的就是排查路径是否正确  
上面的就是因为 Hello\_Servlet 写成 hello\_Servlet 了

情况 2 :

![在这里插入图片描述][47b344a34de14ce18703d433109e28e3.png]

这种情况就是 Tomcat 没启动 , 启动之后再次试一下就好了

--------------------

目前为止 , 我们已经把 Tomcat 的创建讲解完了 , 我们还需要注意以下几个问题

问题 1 : Tomcat 已经启动的状态下 , 启动一个新的 , 就会被重新分配一个端口号 , 新启动的 Tomcat 端口号就不一定是 8080 了

> 一个端口号 , 只能被一个进程绑定

问题 2 : 我已经部署完了 , 之后我又更新了代码 , 那回到浏览器刷新怎么还是不变的 ?

> 这个时候我们就需要重新打包部署 , 不然怎么刷新页面都没用

### 1.8 小结 ###

1.  创建项目 : Maven 项目
2.  引入依赖 : Servlet 对应的依赖
3.  创建目录 : webapp -> WEB-INF -> web.xml
4.  编写代码 :  
    a. 继承 HttpServlet 类  
    b. 重写 doGet 方法  
    c. 加上 @WebServlet 注解
5.  打包程序 : 使用 Maven 提供的 package , 然后还需要修改 pom.xml , 通过 packing 标签设置打包类型为 war , 通过 finalName 属性设置包名
6.  部署程序 : 把 war 包拷贝到 Tomcat 里面的 webapps 目录里面 , 然后重启 Tomcat 服务器
7.  验证程序 : 通过浏览器构造 HTTP 请求 , 访问 Tomcat 服务器  
    URL 路径 = Context Path(war 包的名字) + Servlet Path(注解里面的路径)

如果后续代码发生改变 , 那么必须要重新进行5 ~ 7 操作

> 开发环境 VS 运行环境  
> 开发环境 : 写代码的环境 , 对应的是项目目录  
> 运行环境 : 运行程序的环境 , 对应的是 Tomcat 目录  
> 直接修改代码 , 只是针对开发环境进行了修改 , 我们只有重新进行打包 -> 部署 , 才能在运行环境生效

## 二 . 更方便的部署方式 ##

![在这里插入图片描述][beec524db8284da482ae1d1d5a0c482e.png]

那么我们可以借助 IDEA 里面的一个插件 : Smart Tomcat , 它可以帮助我们进行打包和部署  
那么我教大家怎么进行安装

### 2.1 Smart Tomcat 的安装 ###

1.  File -> Settings  
    ![在这里插入图片描述][e2019622d3bb4e14b73b3a99a7df7bd5.png]
2.  在 Plugins 里面搜索 Smart Tomcat , 点击 Install  
    ![在这里插入图片描述][09e3e4c3ea17482b8ed8db8e39a42cc9.png]

这样 , 我们的 Smart Tomcat 就安装好了  
我们还可以通过网页进行下载 , 然后拖入到 IDEA 里面  
[https://plugins.jetbrains.com/plugin/9492-smart-tomcat][https_plugins.jetbrains.com_plugin_9492-smart-tomcat]  
那么安装完了 Smart Tomcat , 我们怎么来使用呢?

### 2.2 Smart Tomcat 的配置 ###

第一步 : 点击 Add Configuration  
![在这里插入图片描述][c99971d64bba4cb2bc5a88acddf5ddee.png]

第二步 : 点击加号 , 然后选择 Smart Tomcat  
![在这里插入图片描述][a769662e613d4ae0876578fdffaccbf3.png]

第三步 :  
![在这里插入图片描述][651f48290b3e4ea9ba88eae120dbab13.png]

> 配置 tomcat 的路径不用进入到 bin 目录

点击 Tomcat server 右边的 Configure  
![在这里插入图片描述][9c341962c43a4c05a19a655ad4ff368b.png]

选择 Tomcat 的路径 , 然后OK  
![在这里插入图片描述][95853e1d01964e61abca6cd6e525947e.png]

这就 OK 了

### 2.3 Smart Tomcat 的使用 ###

点击这里的绿色三角号 , 编译打包部署程序 , 并且运行 Tomcat  
![在这里插入图片描述][8d9d2e1c5b0446c8b178774d764698ef.png]

我们看到底下红彤彤的 , 就是成功了  
![在这里插入图片描述][e88f95f1898c47b09bd439ebd7613086.png]

要看到底下的 startup in xxx ms 这种字样 , 才算成功  
但是我们之前的 Tomcat 不是弹出来一个黑框框吗 , 所以这就是这个插件的厉害之处 , 把黑框框集成在 IDEA 里面了 , 而且没有乱码了!  
我们再去验证一下  
![在这里插入图片描述][a476b5c7fb11489994cb3bb165cb86a8.png]

成功了  
要注意的是 , Content Path 要保持一致 , 我们之前说过 finalName 就是 Content Path , 我们之前设过的 Content Path 是 Hello\_servlet ,而 Smart Tomcat 里面是 /ServletDemo1 , 所以要修改一下才能成功

![在这里插入图片描述][b50f2c8678404b438fdba3d6b9de1282.png]

但是我们不写 finalName 就不会有这种问题

### 2.4 Smart Tomcat 的原理 ###

Smart Tomcat 是运行 Tomcat 的时候 , 通过其他手段 , 让 Tomcat 直接加载了咱们的代码当中的 webapp 目录 , 这个时候跳过了打包+拷贝的过程 , 也起到了部署的效果 .  
我们之前通过 startup.bat 运行 Tomcat , 运行的是 他目录底下的 webapps , webapps 里面有很多目录 , 他的每一个子目录都是一个 webapp , 也就是一个个小的网站 . 我们通过 startup.bat 启动 , 其实是加载了所有的 webapp , 那么 Smart Tomcat 只是运行了咱们 IDEA 项目对应的 webapp (也就是咱们自己的 webapp 目录) .

## 三 . 常见错误 ##

### 3.1 404 ###

大概率是 URL 写错了 , 也有可能是 webapp 没有正确加载(比如 : web.xml 写错了 , Smart Tomcat 里面的 Content Path 与 URL 不匹配、finalName 与 URL 中的 Content-Path 不匹配等)

### 3.2 405 ###

method not allowed  
比如 : 请求是 Get , 但是我们没实现 doGet , 就会405  
![在这里插入图片描述][c600855c0cb74210a690e56f3b8ede26.png]  
![在这里插入图片描述][12c2bf6466dc4346bb33d2f617e17967.png]

或者写了 doGet , 但是没把 super.doGet(); 删掉 , 也会405  
![在这里插入图片描述][267b87cf98bf4b9698109da50d8d54a2.png]

就会产生未知情况的 405  
![在这里插入图片描述][ea4fe2798f614103a9695a3474db2c4f.png]

### 3.3 500 ###

服务器内部错误 , 也就是服务器挂了  
可能是代码抛异常了  
![在这里插入图片描述][13a824cac5af440cb4e452f839875ab7.png]  
![在这里插入图片描述][f311b66c0e5c48f9ae5ac086527082a3.png]

### 3.4 返回空白页面 ###

应该是忘记写 write 方法了  
![在这里插入图片描述][2091577510514c79a9b8f61c348f56fb.png]  
![在这里插入图片描述][245bc21bbf4440bb82d908961ac8f9df.png]

### 3.5 无法访问此网站 ###

没启动 Tomcat

![在这里插入图片描述][1da63aed59ea47978da5c5a23dc6f5cc.png]

### 3.6 返回中文乱码 ###

当服务器返回的数据是中文的时候 , 此时我们的页面上就会出现乱码  
![在这里插入图片描述][766476be8c364f58b3f48b2b69d9101a.png]

这是因为我们的 IDEA 指定的默认字符是 utf8 , 而浏览器解析字符的时候 , 默认跟操作系统一致 , 我们大多数人都是 windows 简体中文版 , 默认编码是 GBK , 那么浏览器按 GBK 解析 , 必然会出错 , 所以我们要让浏览器按照 utf8 的解析方式来进行解码

我们再次运行 , 这次就成功了  
![在这里插入图片描述][ffcd26daee7b42f591337a2d650eae9f.png]

那么这条语句加的位置也是大有讲究 , 那我加在输出语句后面可不可以 ?

![在这里插入图片描述][8789738c7a34444093aff84e220007c4.png]

又乱码了 , 所以大家记得必须要保证构造响应的 header 要在构造 body 之前 , 否则 header 不生效

--------------------

让浏览器按照 utf8 的解析方式来进行解码 这条语句其实就是在更改header .  
resp.getWriter().write(“你好世界”); 这条语句其实就是通过构造body , 让浏览器返回 body 的内容  
我们来看一下  
这是在没有指定字符集之前 , 抓包的结果  
![在这里插入图片描述][e119a3999baf48c7a8e51c84cae18462.png]

那么我们指定字符集之后 , 我们发现 字符集被设置成功了 , 而且我们的"你好世界"也完美被打印了  
![在这里插入图片描述][d323558812ed47d2bf6906dd0645c195.png]

## 四 . 扩展 : 什么是 JSP ? ##

我们有的同学会在学校学到 JSP 这种东西 , 那 JSP 到底是什么 , 他跟 Servlet 又有什么关系

JSP 可以认为是 Servlet 的一部分 , 在 200x 年很常用 , 但是现在已经退出历史舞台了

我们之前讲过静态页面和动态页面

静态页面就是内容始终固定的页面 , 即使用户不同/时间不同/输入的参数不同 , 页面内容也不会发生变化  
比如我们的 Tomcat 欢迎页就是一个静态页面  
![在这里插入图片描述][0c0b2fdc662342a59b5e1ab70f577dd6.png]

动态页面就是随着用户输入的不同 , 页面呈现出来的效果也不同  
比如我们搜索 鲜花 和 蛋糕 这两个关键字  
![在这里插入图片描述][df3393e567ac4ede996f697996aa9376.png]  
![在这里插入图片描述][dffb607cb226411c9382b99cb725ffa8.png]

我们输入不同的关键字 , 显示出来的是不同的页面 , 那么我们的 JSP 就是专门用来做动态页面的  
制作动态页面的方式基本有两种 :

1.  客户端渲染 : 服务器返回数据 , 由页面通过 js 来生成对应的界面
2.  服务器渲染 : 服务器直接组装好完整的 html , 直接返回给浏览器

由于我们现在普遍的工作方式都是前后端交互 , 大家各干各的事 , 我们不需要考虑具体的页面 , 所以 jsp 慢慢的就退出历史舞台了 , 而且即使我们使用服务器渲染的方式 , 那么我们也有更好的模板引擎 , jsp 就更没优势了

[b4e303b4900b449985c5d31a7bc0e3f2.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/06/abbf0e628a5a40f1bc890592e48c31e8.png
[JavaWeb]: https://blog.csdn.net/m0_53117341/category_12186238.html
[f5bbf30789084c3cad397c23a9adca2a.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/06/7a7994810e4245629f83c5cf39c44651.png
[ebb3eb300713478d92f6111e56477b86.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/06/c0453a5c24564b688172cee6a1752610.png
[507aec8b32e24e279db390019b8f66b3.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/06/3fe262bee5fb4cfa8d55277f01bdc692.png
[2887ac82894344b9a08452d32fab57bd.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/06/41260eb4122e4ae78b2e3b115a1ce3dd.png
[0f0da204e8b44400ba8031a92c19ce2f.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/06/96a682ef932c466d8c87a714182b26a5.png
[d855b5b7841e40cf82f98b61ce156279.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/06/784e6b149f664d46a14f58686bdf0d3e.png
[https_mvnrepository.com]: https://mvnrepository.com/
[31a7b29bcb594dc6be7613dac7cd2e52.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/06/b1c8ddf1a499411e85aaee53a1a9791a.png
[24628ae0a21a4e13991b60100a9f5ab1.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/06/18ec55ef3e7e4b4b89bc65efd59b2838.png
[360d63aa717746c99146c70c2a67867f.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/06/e050db23115540779b5451fd5256ea78.png
[e492974de15644589d997f6a07cee401.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/06/79b3baa0a9eb420182877ba117bbfca7.png
[97c0f280ab334640a48f3226adb25b41.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/06/8c9023f56e134a73a6673aa91e200265.png
[a90aae2341e74b15a1a83bf44942c17a.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/06/c437164133b1438fb66769d96e8a20f1.png
[7226c2db6da8424ba32eed6760217205.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/06/90f121948bca4de3aab4b6294deab035.png
[f4e3984d31a0439994633264545d2837.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/06/34e81f80a7124a368bd9870024bb3f7a.png
[a1bfd2c0d17440839826f1eee2d66698.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/06/6fe389cee7ac4154a48880de14bb2fa0.png
[51647826fc2747b2b4f1864ca265dce4.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/06/09382ce058db498b99e4d008fc7e19ba.png
[c8701587731444608c5c92db51bbb32c.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/06/4091414b7f3442008d6565f62d3f470a.png
[3b581d62fba94eb8bcac2c020a7979fa.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/06/e0e252c77b604e959afaa4db8a17c9c2.png
[4431128a84394dad9cc922600386e484.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/06/5f20d82eb9104e7ba8a510772ca3f40b.png
[d13cae3ebc7d4626985dd415c6b90a09.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/06/e7d199ddd32b468faafaec1442c04cbd.png
[d835241c578d43e7b19a11100785da7f.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/06/36086920eaa94fb58d00ffe308367463.png
[7d4b758a2d784b62bd98492320273f2d.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/06/a92d5daadde84354a0eee1ae95930a86.png
[7ac5422b674e430cb1d68e9ceb050a82.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/06/562e68844c534042b97ca239b8568e56.png
[a9ca9fbaf5584105ba1b6cade315840d.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/06/cfd2e94962ab4af3b2f7cb342549e759.png
[631f9e7731ac473f92eb374aa44fb824.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/06/c2f6194ef0db4011bd29529d112be7bf.png
[75c9699617b446eaacd9ffbb19246ca1.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/06/d84c73d8844640ae9f0cc6c13d49fee6.png
[b9d52c6b08e54b96a661552b8d35884d.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/06/c890e51689fd4ab8a6a2765d59104699.png
[0bea89d2cea74b58a2c1a8c2b7b9935e.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/06/733065dbff6f4393878a48f570d47d2a.png
[185d844bf13b4d3e9e7dbd8d76c55f34.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/06/b4bdac9210b14c19a50b833965edffb1.png
[97127bdda8d54b4ca97c10da2117608f.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/06/adb33813b322463f941839b5f0384194.png
[c90dbdba932a4818bd46e53203489501.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/06/abb32e62d22d4d70a53f4049237aaea4.png
[1820f1285d774ff8bdd3cabb4cb11029.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/06/c3fdc1cff9c0451cb5bdd32107c5fb6d.png
[01e19a65120b49f497d3b6601da0fc2e.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/06/80a66f9568d2430da95c1d88dd835dc7.png
[56b9b05d583b4af7aa1090e9092e5995.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/06/887a12498bce4fa28e239930ea113174.png
[4cdf4cf102e84ec19b3ba2aec5752c53.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/06/053d09aa659940cfb512418bbe3c633e.png
[8e86158e9b374935810400db12b8aaab.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/06/041905cf82ed4391ad8fff873f110b43.png
[e4db73ad5eed48e9899cab1696a40149.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/06/3e4fd8e937b64b02b402c575b66a5983.png
[bd9182bfdd4c4eed8569e230a68524b9.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/06/4b164fa63f584dbfbfce8cd079e48af6.png
[127.0.0.1_8080_Hello_servlet_hello]: http://127.0.0.1:8080/Hello_servlet/hello
[a9dc119f784848d5b06f214f31fb758e.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/06/c18f870c59dc4ecabbc6ee0b0d42b3a2.png
[cb4d99c75273488cb80d87f82897ac2c.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/06/0cf7f7b62e6b4f4bb78c732ca7ee4a12.png
[e16cec25ee1846f4b50b2cb04f153cdb.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/06/87240079288c4c98b356143f42d7e02c.png
[f47f41ee616649baaa193fecdae8cc55.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/06/d2d190d823c6440abfd57fb02680055d.png
[b8461729c6c149cbada227adb2a6e3a9.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/06/bc361cce288f4574b929912cac41710b.png
[670d85584e26413ab584c856c34b4007.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/06/d243792814d844fc9401ec85de8dcf7f.png
[47b344a34de14ce18703d433109e28e3.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/06/65c1596bdb4941b197f7311f269ad1ad.png
[beec524db8284da482ae1d1d5a0c482e.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/06/03a5a12c420e48f7b62237958a49c118.png
[e2019622d3bb4e14b73b3a99a7df7bd5.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/06/1620c917f9d94ba9969a097e23a64c7b.png
[09e3e4c3ea17482b8ed8db8e39a42cc9.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/06/4c1062a183ee4f6eb1f81db7f9647ce3.png
[https_plugins.jetbrains.com_plugin_9492-smart-tomcat]: https://plugins.jetbrains.com/plugin/9492-smart-tomcat
[c99971d64bba4cb2bc5a88acddf5ddee.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/06/de01f80cb5934967818c77ccda96715e.png
[a769662e613d4ae0876578fdffaccbf3.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/06/1bb343b0d7e541b2b1898fe99e13cd02.png
[651f48290b3e4ea9ba88eae120dbab13.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/06/a81b156eea0a4c94aae68d7d46101a20.png
[9c341962c43a4c05a19a655ad4ff368b.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/06/93c3e15121ec49079d2667225bc76029.png
[95853e1d01964e61abca6cd6e525947e.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/06/4dff31ff1b4345f7a3f81848ef9e4c22.png
[8d9d2e1c5b0446c8b178774d764698ef.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/06/7b58ce03dbdc4a4e8c2150020d18233f.png
[e88f95f1898c47b09bd439ebd7613086.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/06/4fe10d1587344d72b76dcc9cce44acf3.png
[a476b5c7fb11489994cb3bb165cb86a8.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/06/4bed91c8b4bf4eb6ae5615cbaad618c2.png
[b50f2c8678404b438fdba3d6b9de1282.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/06/930b5400bc464f96a5ce8c34d49dd7cd.png
[c600855c0cb74210a690e56f3b8ede26.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/06/7173062e12fd4e1fbaaa2df0692ea983.png
[12c2bf6466dc4346bb33d2f617e17967.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/06/dc84d823f18246079b45d0a09b6164fa.png
[267b87cf98bf4b9698109da50d8d54a2.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/06/beefe2c427064fa684b1da03609cc625.png
[ea4fe2798f614103a9695a3474db2c4f.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/06/c061d2dd65ca46bba831195122b48c54.png
[13a824cac5af440cb4e452f839875ab7.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/06/627bf2a02eb0436d9a9afefb5db57c6d.png
[f311b66c0e5c48f9ae5ac086527082a3.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/06/24a83e823b594527a4d62d1b695c4b65.png
[2091577510514c79a9b8f61c348f56fb.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/06/f67e26432b0c4e3db7c992465688f28d.png
[245bc21bbf4440bb82d908961ac8f9df.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/06/c2838840337c4de984d6b1f86f96eb6f.png
[1da63aed59ea47978da5c5a23dc6f5cc.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/06/2fb68ba50bf64dd4a4bde048afb9c455.png
[766476be8c364f58b3f48b2b69d9101a.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/06/c7cf1721b9e04448bfe91dcce3efa4b4.png
[ffcd26daee7b42f591337a2d650eae9f.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/06/fca859eea59c47b990a1c08b752bffe6.png
[8789738c7a34444093aff84e220007c4.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/06/3edac6e4cd8f4ddabdd61e991a5dcf28.png
[e119a3999baf48c7a8e51c84cae18462.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/06/2219fa5994ee4acd8f0382eeec8ae64b.png
[d323558812ed47d2bf6906dd0645c195.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/06/71c8f42d4ec847ddbb71f32f084a0008.png
[0c0b2fdc662342a59b5e1ab70f577dd6.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/06/19337df36c884df29a142cf043e327d6.png
[df3393e567ac4ede996f697996aa9376.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/06/1b481e1c9ebc43ee81f3b5766cc5ffee.png
[dffb607cb226411c9382b99cb725ffa8.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/06/935376088c8640a9abcf4fc07fe6a4f5.png