1. 项目概述与核心价值最近在带新人或者和一些同行交流时发现一个挺有意思的现象很多朋友一上来就想搞Spring Boot、微服务这些“高级货”但问到怎么在IDEA里创建一个最基础的、能跑起来的JSP动态Web项目时反而有点懵。要么是Tomcat配置不对要么是项目结构有问题最后浏览器里永远是个404。这让我想起自己刚入行那会儿也是在这些基础环节上踩了不少坑。所以今天我就打算抛开那些复杂的框架回归最本质的东西手把手带你用IntelliJ IDEA后面简称IDEA从零搭建一个完整的JSP项目。这不仅仅是点几下鼠标的教程我会把每一步背后的逻辑、常见的“坑”以及我这些年积累的调试技巧都揉进去。无论你是刚接触Java Web开发的学生还是想巩固基础的在职开发者跟着走一遍你不仅能得到一个可运行的项目更能彻底理解一个Web应用在IDEA中是如何被组织、配置和运行的。这就像盖房子地基打牢了后面往上加什么框架都心里有底。2. 环境准备与工具选型解析2.1 JDK的选择与配置考量万事开头难而Java项目的开头就是JDK。很多人觉得随便装个JDK 8就行但其实这里有点讲究。对于传统的JSP/Servlet项目我强烈推荐使用JDK 8或JDK 11 (LTS版本)。为什么不直接用最新的JDK 20呢主要是为了与后续我们要用的Tomcat服务器保持最佳兼容性。Tomcat 9.x 和 10.x 对高版本JDK的新特性支持需要额外的配置为了避免不必要的麻烦选择一个久经考验的版本是明智之举。你可以在Oracle官网或Adoptium等开源站点下载。安装后关键一步是配置环境变量JAVA_HOME。这个变量必须指向你的JDK安装根目录比如C:\Program Files\Java\jdk1.8.0_381而不是bin目录。PATH变量里则要添加%JAVA_HOME%\bin。验证方法是在命令行输入java -version和javac -version确保版本一致且能正常显示。我见过不少“配置好了但IDE识别不了”的问题八成都是JAVA_HOME设错了。2.2 IntelliJ IDEA版本与必要插件IDE方面社区版Community就完全够用它免费且包含了Web开发的基础功能。当然如果你有Ultimate版会多一些像Spring Boot直接支持、数据库工具等高级特性但对于纯JSP项目不是必须的。安装好IDEA后我建议先检查几个关键设置。进入File - Settings(Windows/Linux) 或IntelliJ IDEA - Preferences(macOS)找到Build, Execution, Deployment - Build Tools - Maven。如果你打算用Maven管理依赖推荐这里可以设置你的本地仓库路径和Maven版本。更重要的是Build, Execution, Deployment - Application Servers这里是我们后续配置Tomcat的地方。虽然现在里面是空的但先知道这个入口在哪。注意不建议在项目创建初期就安装一大堆插件保持环境干净可以减少干扰。唯一可能需要的是Smart Tomcat这类第三方部署插件但对于初学者我建议先用IDEA自带的Tomcat集成功能更标准问题也更少。2.3 Tomcat服务器的下载与核心认知Tomcat是我们的运行时容器。去Apache Tomcat官网下载Tomcat 9.x版本。为什么不选10Tomcat 10将Java EE的包名从javax.*改为了jakarta.*这会导致很多旧的库和教程代码不兼容。对于学习和大多数传统项目Tomcat 9是最稳妥的选择。下载“zip”或“tar.gz”压缩包即可解压到一个没有中文和空格的路径下比如D:\DevTools\apache-tomcat-9.0.85。你需要了解Tomcat目录的几个核心部分bin启动/关闭脚本。startup.bat(Windows) 或startup.sh(Linux/macOS) 用于启动。conf配置文件。最重要的server.xml(主配置)、web.xml(全局应用描述)。webapps默认的Web应用部署目录。你把WAR包放这里Tomcat启动时会自动解压部署。logs日志文件。出问题时第一个要看的就是这里的catalina.out或localhost.log。3. 项目创建与结构深度剖析3.1 创建新项目与模块类型选择打开IDEA点击New Project。这里是最容易出错的第一步。在左侧列表中不要选Java或Spring Initializr而应该选择Java Enterprise。在右侧你会看到Project SDK确保它显示了你刚才安装的JDK版本。关键在下方Additional Libraries and Frameworks区域。你需要勾选Web Application。请注意这里通常会有两个版本可选“Web Application”和“Web Application (4.0)”。它们对应的是Servlet API的版本。选择Web Application (4.0)因为它对应Servlet 4.0规范功能更全也是Tomcat 9.x默认支持的。同时把Create web.xml这个复选框取消勾选。现代的方式是使用注解如WebServlet来配置Servlet这更简洁。我们稍后会手动创建它以便理解其结构。项目命名和路径按你喜好设置即可点击Create。3.2 解读生成的项目骨架项目创建好后IDEA会自动生成一个标准的结构。我们重点看src/main目录下java 存放你的Java源代码如Servlet、JavaBean、工具类等。现在它是空的。resources 存放资源文件如属性文件、XML配置文件等。webapp 这是Web应用的根目录也是所有Web内容JSP、HTML、CSS、JS、图片的存放地。它里面有几个关键子项WEB-INF 这是一个受保护的目录。浏览器无法直接访问其中的任何文件。它里面通常放web.xml 项目的部署描述符。虽然我们没让IDEA生成但最好有一个即使它是空的或仅包含版本声明这是一个好习惯。lib 存放项目依赖的第三方JAR包如果你没用Maven/Gradle。classes 编译后的Java类文件IDEA和构建工具会自动处理通常看不到。index.jsp IDEA自动生成的一个示例JSP页面。这个结构是Java Web应用的“宪法”遵循它你的应用才能被Tomcat等Servlet容器正确识别和加载。3.3 手动补全关键配置文件web.xml在webapp/WEB-INF目录上右键New - File输入web.xml。将以下内容粘贴进去?xml version1.0 encodingUTF-8? web-app xmlnshttp://xmlns.jcp.org/xml/ns/javaee xmlns:xsihttp://www.w3.org/2001/XMLSchema-instance xsi:schemaLocationhttp://xmlns.jcp.org/xml/ns/javaee http://xmlns.jcp.org/xml/ns/javaee/web-app_4_0.xsd version4.0 display-nameMyFirstJspProject/display-name welcome-file-list welcome-fileindex.jsp/welcome-file /welcome-file-list /web-app这个文件做了两件事1. 声明这是一个遵循Servlet 4.0规范的应用。2. 设置了默认欢迎页面为index.jsp。这意味着当你访问项目根路径如http://localhost:8080/your_project/时Tomcat会自动寻找并展示index.jsp。4. 集成Tomcat服务器与运行配置详解4.1 在IDEA中添加Tomcat服务器实例这是连接代码和运行环境的关键一步。点击IDEA右上角运行配置下拉框通常显示为“Add Configuration…”选择Edit Configurations...。在弹出的窗口中点击左上角的号向下滚动找到Tomcat Server选择Local。在接下来的Server标签页中Application server 点击Configure...然后点击选择你解压的Tomcat 9的根目录。IDEA会识别它并设置好。Open browser 勾选并设置URL。通常Tomcat默认端口是8080但为了避免和你电脑上其他服务冲突我习惯改成8081。所以URL可以设为http://localhost:8081/。同时勾选After launch。JRE 确保它和你的项目SDK版本一致。VM options 可以添加-Dfile.encodingUTF-8来统一控制台和文件的编码防止乱码。4.2 部署工件Deployment配置光有服务器还不够得告诉Tomcat要运行哪个项目。切换到Deployment标签页。点击-Artifact。你会看到IDEA已经根据你的项目模块生成了一个工件名字可能是[你的项目名]:war exploded。务必选择带exploded的这个。“exploded”意为“展开的”它不会打包成WAR文件而是直接使用项目目录下的文件进行热部署。这非常适合开发因为你修改了JSP或Java代码后IDEA可以快速更新无需重启整个Tomcat对于JSP通常只需刷新浏览器对于Servlet可能需要Update操作。Application context这个字段至关重要它决定了你的Web应用的访问路径。默认可能是/你的项目名_war_exploded这个路径太长了。我强烈建议把它简化为/demo或者/myapp。这样你的应用访问地址就是http://localhost:8081/demo。实操心得Application context是导致404错误的“重灾区”之一。很多人配置完直接访问http://localhost:8081发现是Tomcat主页就以为失败了。一定要记住你需要访问的是http://localhost:8081/你设置的Context路径。另一个常见错误是路径前面漏了/。4.3 启动测试与首次运行验证配置完成后点击Apply-OK保存。现在点击IDEA右上角的绿色运行按钮或Debug按钮。IDEA会启动Tomcat并在控制台输出大量日志。看到类似[Tomcat] Started on port(s): 8081 (http)和[Your Artifact] deployed successfully的信息就说明启动成功了。你的默认浏览器会自动打开http://localhost:8081/demo如果你按我的配置。你应该能看到index.jsp的默认内容可能是一句“Hello World!”或者一个简单的JSP页面。恭喜你一个最基础的JSP项目环境已经跑通了5. 从静态到动态编写第一个Servlet与JSP5.1 创建并理解Servlet的作用现在我们来让项目“动”起来。在src/main/java下新建一个包例如com.example.web。在该包上右键New - Servlet。如果IDEA没有直接提供Servlet创建选项就选择Java Class然后手动继承javax.servlet.http.HttpServlet。我们创建一个简单的HelloServletpackage com.example.web; 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; import java.io.PrintWriter; WebServlet(/hello) // 这是关键定义了Servlet的访问URL路径 public class HelloServlet extends HttpServlet { Override protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException { // 设置响应内容类型和编码 resp.setContentType(text/html;charsetUTF-8); PrintWriter out resp.getWriter(); // 获取请求参数 String name req.getParameter(name); if (name null || name.trim().isEmpty()) { name 访客; } // 生成动态HTML out.println(!DOCTYPE html); out.println(html); out.println(headtitleServlet示例/title/head); out.println(body); out.println(h1你好, name !/h1); out.println(p这个页面由HelloServlet动态生成。/p); out.println(/body); out.println(/html); } }核心是WebServlet(/hello)这个注解。它取代了传统web.xml中的servlet-mapping配置告诉容器当用户访问http://localhost:8081/demo/hello时就由这个HelloServlet类的doGet方法来处理。5.2 改造JSP页面并引入动态元素现在我们来修改自动生成的index.jsp让它不仅能显示静态内容还能链接到我们的Servlet并展示一些简单的JSP动态特性。% page contentTypetext/html; charsetUTF-8 pageEncodingUTF-8 % !DOCTYPE html html head title我的第一个JSP项目主页/title style body { font-family: Arial, sans-serif; margin: 40px; } a { color: blue; text-decoration: none; } a:hover { text-decoration: underline; } /style /head body h1欢迎来到JSP学习页面/h1 p当前服务器时间strong% new java.util.Date() %/strong/p !-- JSP脚本表达式 -- % // JSP脚本片段可以写Java代码 String userAgent request.getHeader(User-Agent); boolean isMobile userAgent ! null (userAgent.contains(Mobile) || userAgent.contains(Android)); % p您正在使用em% isMobile ? 移动设备 : 桌面浏览器 %/em 访问本页。/p hr h2功能演示/h2 ul lia hrefhello访问HelloServlet无参数/a/li lia hrefhello?name张三访问HelloServlet带参数name张三/a/li /ul form actionhello methodget label forusername输入你的名字/label input typetext idusername namename placeholder请输入 button typesubmit提交问候/button /form hr p这是一个标准的JSP页面它混合了HTML、CSS和Java代码通过lt;% ... %gt;标签。/p /body /html这个JSP页面做了几件事使用% ... %直接输出动态内容当前时间。使用% ... %编写脚本片段处理业务逻辑判断访问设备。提供了链接和表单与之前创建的HelloServlet进行交互。5.3 重启与功能验证由于我们添加了新的Java类Servlet需要让IDEA重新部署一下。最稳妥的方式是点击Tomcat运行窗口的“重启”按钮红色方框旁边带弯箭头的那个或者先停止再运行。重启后刷新你的浏览器地址应为http://localhost:8081/demo/。你应该能看到更新后的主页显示了动态时间、设备类型以及两个链接和一个表单。点击“访问HelloServlet带参数”或输入名字后提交表单页面会跳转到http://localhost:8081/demo/hello?namexxx并显示Servlet生成的个性化问候。至此一个具备基本交互功能的动态Web应用就完成了。6. 深度排查根治404错误与其他常见问题即使按照步骤操作你也可能遇到问题。下面是我总结的几个最常见“坑位”及其解决方案。6.1 404错误的系统性排查流程看到“HTTP Status 404 – Not Found”别慌按以下顺序检查检查URL是否完全正确这是最最常见的错误。确认你的访问地址是http://localhost:端口号/应用上下文路径/资源路径。端口号 去IDEA的运行配置里确认Tomcat - Server标签页的HTTP端口。应用上下文路径 去IDEA的运行配置里确认Tomcat - Deployment标签页的Application context。它必须以/开头。资源路径 对于Servlet是WebServlet(“/xxx”)里定义的路径。对于JSP/HTML是它在webapp目录下的相对路径。注意大小写检查Tomcat控制台日志启动时有没有报错有没有deployed successfully的字样如果应用根本没部署成功肯定404。常见的部署失败原因包括编译错误看“Build”日志、依赖缺失比如Servlet API的JAR包没引入、web.xml格式错误。检查项目工件是否成功部署在IDEA的Project视图里展开External Libraries看看有没有Tomcat 9.0.x相关的库里面应该包含servlet-api.jar等。如果没有说明项目模块没有正确关联Tomcat的库。你需要File - Project Structure - Modules选中你的模块在Dependencies标签页添加Library-Tomcat 9.0.x。检查“Update”动作如果你修改了Java代码Servlet仅仅重启Tomcat可能不够。你需要点击IDEA运行工具栏上的“更新”按钮一个绿色的循环箭头或通过快捷键CtrlF10/CmdF10调出“Update”菜单选择Update classes and resources或Redeploy。6.2 其他高频问题与解决技巧问题现象可能原因解决方案控制台或页面中文乱码1. 文件编码不统一。2. Tomcat输出日志编码未设。3. Servlet/JSP响应未设编码。1. 统一项目所有文件编码为UTF-8File - Settings - Editor - File Encodings。2. 在Tomcat运行配置的VM options中添加-Dfile.encodingUTF-8。3. 确保Servlet和JSP都设置了resp.setContentType(“text/html;charsetUTF-8”);和pageEncoding”UTF-8″。修改JSP后刷新浏览器不生效Tomcat缓存了旧的JSP编译结果.java和.class文件。1. 重启Tomcat是最彻底的方法。2. 找到Tomcat工作目录在IDEA运行配置的Server标签页On frame deactivation选项下面有路径删除里面对应你项目的work子目录然后重启。“Cannot resolve symbol ‘HttpServlet’”项目缺少Servlet API依赖。确保已按6.1第3步添加了Tomcat库。或者如果你使用Maven在pom.xml中添加依赖scopeprovided/scope的javax.servlet:javax.servlet-api。Tomcat启动超时45秒应用部署或初始化太慢超过了默认45秒限制。在IDEA运行配置的Server标签页找到Startup/Connection选项卡将Startup超时时间如45改大比如120秒。端口被占用Address already in use8080或8081端口已被其他程序如另一个Tomcat、Skype等使用。1. 在运行配置中换一个端口如8090。2. 命令行查找占用端口的进程并结束它Windows:netstat -ano | findstr :8080Linux/macOS:lsof -i:8080。6.3 开发中的高效调试习惯善用日志不要只依赖System.out.println()。学习使用java.util.logging或更强大的Log4j2/SLF4J来记录不同级别的日志INFO, DEBUG, ERROR。浏览器开发者工具是利器按F12打开看Network标签页。这里能清晰看到每一个请求的URL、方法、状态码、响应头和响应体。404错误在这里一目了然。对于500内部服务器错误响应体里通常会有Tomcat抛出的异常堆栈信息这是定位代码错误的关键。理解“热部署”的界限IDEA的“Update”动作对于修改JSP文件通常是即时生效的因为JSP是运行时编译。但对于修改Servlet类、添加新的依赖库通常需要Redeploy或重启。了解这一点可以节省很多无效的等待时间。7. 项目优化与生产意识培养一个能跑起来的项目只是开始。要让项目更健壮、更易于维护你需要建立一些“生产意识”。7.1 引入Maven进行依赖管理手动管理JAR包是噩梦。强烈建议将项目转换为Maven项目。在项目根目录上右键选择Add Framework Support…勾选Maven。IDEA会生成一个pom.xml文件。一个基础的JSP项目pom.xml可能长这样?xml version1.0 encodingUTF-8? project xmlnshttp://maven.apache.org/POM/4.0.0 xmlns:xsihttp://www.w3.org/2001/XMLSchema-instance xsi:schemaLocationhttp://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd modelVersion4.0.0/modelVersion groupIdcom.example/groupId artifactIdmy-first-jsp-project/artifactId version1.0-SNAPSHOT/version packagingwar/packaging !-- 打包成WAR -- properties project.build.sourceEncodingUTF-8/project.build.sourceEncoding maven.compiler.source1.8/maven.compiler.source maven.compiler.target1.8/maven.compiler.target /properties dependencies !-- Servlet API由Tomcat提供所以scope是provided -- dependency groupIdjavax.servlet/groupId artifactIdjavax.servlet-api/artifactId version4.0.1/version scopeprovided/scope /dependency !-- JSTL标签库简化JSP中的逻辑 -- dependency groupIdjavax.servlet/groupId artifactIdjstl/artifactId version1.2/version /dependency /dependencies build finalName${project.artifactId}/finalName !-- 打包后的WAR文件名 -- plugins plugin groupIdorg.apache.maven.plugins/groupId artifactIdmaven-war-plugin/artifactId version3.3.2/version /plugin plugin groupIdorg.apache.maven.plugins/groupId artifactIdmaven-compiler-plugin/artifactId version3.11.0/version configuration source1.8/source target1.8/target /configuration /plugin /plugins /build /project引入Maven后你的项目结构会微调webapp目录会移动到src/main/webapp。所有依赖只需在pom.xml中声明Maven会自动从中央仓库下载。这为项目引入了标准化和可复现性。7.2 代码结构分层与MVC思想萌芽即使是一个小项目也要有良好的代码组织习惯。这为将来引入Spring MVC等框架打下基础。com.example.model 存放数据模型或JavaBean如User, Product。com.example.dao或com.example.repository 存放数据访问对象负责与数据库交互可以先写接口和模拟实现。com.example.service 存放业务逻辑层处理复杂的业务规则。com.example.web或com.example.controller 存放Servlet它们现在只负责接收请求、调用Service、转发请求到JSP视图。例如你的HelloServlet可以进化它从request获取参数后调用一个GreetingService来生成问候语然后将结果放入request属性中最后转发到一个专门的hello.jsp视图页面进行展示。这就是最原始的MVCModel-View-Controller模式。7.3 打包与独立部署开发完成后你需要将项目交付或部署到独立的Tomcat服务器上。在IDEA右侧边栏打开Maven工具窗口。展开你的项目 -Lifecycle。双击package。Maven会在target目录下生成一个my-first-jsp-project.war文件名字由pom.xml中的finalName决定。将这个WAR文件复制到独立Tomcat的webapps目录下。启动这个独立的Tomcat运行其bin/startup.bat它会自动解压WAR包并部署应用。访问http://独立服务器IP:端口/my-first-jsp-project即可。这个过程让你理解IDEA内置的Tomcat只是一个便捷的开发工具最终的应用需要脱离IDE独立运行。走完这一整套流程你收获的不仅仅是一个在IDEA里能运行的JSP项目。你理解了环境配置的每一个细节知道了项目结构为何如此设计掌握了Servlet和JSP如何协同工作更学会了当事情不按预期发展时如何像侦探一样一步步排查问题。这些技能和经验是任何框架教程都不会详细告诉你的但却是你从“会写代码”到“能搞定项目”的必经之路。下次当你再面对一个陌生的Web项目时这套从环境到部署的完整认知地图会让你心里有底从容不迫。
1. 项目概述与核心价值最近在带新人或者和一些同行交流时发现一个挺有意思的现象很多朋友一上来就想搞Spring Boot、微服务这些“高级货”但问到怎么在IDEA里创建一个最基础的、能跑起来的JSP动态Web项目时反而有点懵。要么是Tomcat配置不对要么是项目结构有问题最后浏览器里永远是个404。这让我想起自己刚入行那会儿也是在这些基础环节上踩了不少坑。所以今天我就打算抛开那些复杂的框架回归最本质的东西手把手带你用IntelliJ IDEA后面简称IDEA从零搭建一个完整的JSP项目。这不仅仅是点几下鼠标的教程我会把每一步背后的逻辑、常见的“坑”以及我这些年积累的调试技巧都揉进去。无论你是刚接触Java Web开发的学生还是想巩固基础的在职开发者跟着走一遍你不仅能得到一个可运行的项目更能彻底理解一个Web应用在IDEA中是如何被组织、配置和运行的。这就像盖房子地基打牢了后面往上加什么框架都心里有底。2. 环境准备与工具选型解析2.1 JDK的选择与配置考量万事开头难而Java项目的开头就是JDK。很多人觉得随便装个JDK 8就行但其实这里有点讲究。对于传统的JSP/Servlet项目我强烈推荐使用JDK 8或JDK 11 (LTS版本)。为什么不直接用最新的JDK 20呢主要是为了与后续我们要用的Tomcat服务器保持最佳兼容性。Tomcat 9.x 和 10.x 对高版本JDK的新特性支持需要额外的配置为了避免不必要的麻烦选择一个久经考验的版本是明智之举。你可以在Oracle官网或Adoptium等开源站点下载。安装后关键一步是配置环境变量JAVA_HOME。这个变量必须指向你的JDK安装根目录比如C:\Program Files\Java\jdk1.8.0_381而不是bin目录。PATH变量里则要添加%JAVA_HOME%\bin。验证方法是在命令行输入java -version和javac -version确保版本一致且能正常显示。我见过不少“配置好了但IDE识别不了”的问题八成都是JAVA_HOME设错了。2.2 IntelliJ IDEA版本与必要插件IDE方面社区版Community就完全够用它免费且包含了Web开发的基础功能。当然如果你有Ultimate版会多一些像Spring Boot直接支持、数据库工具等高级特性但对于纯JSP项目不是必须的。安装好IDEA后我建议先检查几个关键设置。进入File - Settings(Windows/Linux) 或IntelliJ IDEA - Preferences(macOS)找到Build, Execution, Deployment - Build Tools - Maven。如果你打算用Maven管理依赖推荐这里可以设置你的本地仓库路径和Maven版本。更重要的是Build, Execution, Deployment - Application Servers这里是我们后续配置Tomcat的地方。虽然现在里面是空的但先知道这个入口在哪。注意不建议在项目创建初期就安装一大堆插件保持环境干净可以减少干扰。唯一可能需要的是Smart Tomcat这类第三方部署插件但对于初学者我建议先用IDEA自带的Tomcat集成功能更标准问题也更少。2.3 Tomcat服务器的下载与核心认知Tomcat是我们的运行时容器。去Apache Tomcat官网下载Tomcat 9.x版本。为什么不选10Tomcat 10将Java EE的包名从javax.*改为了jakarta.*这会导致很多旧的库和教程代码不兼容。对于学习和大多数传统项目Tomcat 9是最稳妥的选择。下载“zip”或“tar.gz”压缩包即可解压到一个没有中文和空格的路径下比如D:\DevTools\apache-tomcat-9.0.85。你需要了解Tomcat目录的几个核心部分bin启动/关闭脚本。startup.bat(Windows) 或startup.sh(Linux/macOS) 用于启动。conf配置文件。最重要的server.xml(主配置)、web.xml(全局应用描述)。webapps默认的Web应用部署目录。你把WAR包放这里Tomcat启动时会自动解压部署。logs日志文件。出问题时第一个要看的就是这里的catalina.out或localhost.log。3. 项目创建与结构深度剖析3.1 创建新项目与模块类型选择打开IDEA点击New Project。这里是最容易出错的第一步。在左侧列表中不要选Java或Spring Initializr而应该选择Java Enterprise。在右侧你会看到Project SDK确保它显示了你刚才安装的JDK版本。关键在下方Additional Libraries and Frameworks区域。你需要勾选Web Application。请注意这里通常会有两个版本可选“Web Application”和“Web Application (4.0)”。它们对应的是Servlet API的版本。选择Web Application (4.0)因为它对应Servlet 4.0规范功能更全也是Tomcat 9.x默认支持的。同时把Create web.xml这个复选框取消勾选。现代的方式是使用注解如WebServlet来配置Servlet这更简洁。我们稍后会手动创建它以便理解其结构。项目命名和路径按你喜好设置即可点击Create。3.2 解读生成的项目骨架项目创建好后IDEA会自动生成一个标准的结构。我们重点看src/main目录下java 存放你的Java源代码如Servlet、JavaBean、工具类等。现在它是空的。resources 存放资源文件如属性文件、XML配置文件等。webapp 这是Web应用的根目录也是所有Web内容JSP、HTML、CSS、JS、图片的存放地。它里面有几个关键子项WEB-INF 这是一个受保护的目录。浏览器无法直接访问其中的任何文件。它里面通常放web.xml 项目的部署描述符。虽然我们没让IDEA生成但最好有一个即使它是空的或仅包含版本声明这是一个好习惯。lib 存放项目依赖的第三方JAR包如果你没用Maven/Gradle。classes 编译后的Java类文件IDEA和构建工具会自动处理通常看不到。index.jsp IDEA自动生成的一个示例JSP页面。这个结构是Java Web应用的“宪法”遵循它你的应用才能被Tomcat等Servlet容器正确识别和加载。3.3 手动补全关键配置文件web.xml在webapp/WEB-INF目录上右键New - File输入web.xml。将以下内容粘贴进去?xml version1.0 encodingUTF-8? web-app xmlnshttp://xmlns.jcp.org/xml/ns/javaee xmlns:xsihttp://www.w3.org/2001/XMLSchema-instance xsi:schemaLocationhttp://xmlns.jcp.org/xml/ns/javaee http://xmlns.jcp.org/xml/ns/javaee/web-app_4_0.xsd version4.0 display-nameMyFirstJspProject/display-name welcome-file-list welcome-fileindex.jsp/welcome-file /welcome-file-list /web-app这个文件做了两件事1. 声明这是一个遵循Servlet 4.0规范的应用。2. 设置了默认欢迎页面为index.jsp。这意味着当你访问项目根路径如http://localhost:8080/your_project/时Tomcat会自动寻找并展示index.jsp。4. 集成Tomcat服务器与运行配置详解4.1 在IDEA中添加Tomcat服务器实例这是连接代码和运行环境的关键一步。点击IDEA右上角运行配置下拉框通常显示为“Add Configuration…”选择Edit Configurations...。在弹出的窗口中点击左上角的号向下滚动找到Tomcat Server选择Local。在接下来的Server标签页中Application server 点击Configure...然后点击选择你解压的Tomcat 9的根目录。IDEA会识别它并设置好。Open browser 勾选并设置URL。通常Tomcat默认端口是8080但为了避免和你电脑上其他服务冲突我习惯改成8081。所以URL可以设为http://localhost:8081/。同时勾选After launch。JRE 确保它和你的项目SDK版本一致。VM options 可以添加-Dfile.encodingUTF-8来统一控制台和文件的编码防止乱码。4.2 部署工件Deployment配置光有服务器还不够得告诉Tomcat要运行哪个项目。切换到Deployment标签页。点击-Artifact。你会看到IDEA已经根据你的项目模块生成了一个工件名字可能是[你的项目名]:war exploded。务必选择带exploded的这个。“exploded”意为“展开的”它不会打包成WAR文件而是直接使用项目目录下的文件进行热部署。这非常适合开发因为你修改了JSP或Java代码后IDEA可以快速更新无需重启整个Tomcat对于JSP通常只需刷新浏览器对于Servlet可能需要Update操作。Application context这个字段至关重要它决定了你的Web应用的访问路径。默认可能是/你的项目名_war_exploded这个路径太长了。我强烈建议把它简化为/demo或者/myapp。这样你的应用访问地址就是http://localhost:8081/demo。实操心得Application context是导致404错误的“重灾区”之一。很多人配置完直接访问http://localhost:8081发现是Tomcat主页就以为失败了。一定要记住你需要访问的是http://localhost:8081/你设置的Context路径。另一个常见错误是路径前面漏了/。4.3 启动测试与首次运行验证配置完成后点击Apply-OK保存。现在点击IDEA右上角的绿色运行按钮或Debug按钮。IDEA会启动Tomcat并在控制台输出大量日志。看到类似[Tomcat] Started on port(s): 8081 (http)和[Your Artifact] deployed successfully的信息就说明启动成功了。你的默认浏览器会自动打开http://localhost:8081/demo如果你按我的配置。你应该能看到index.jsp的默认内容可能是一句“Hello World!”或者一个简单的JSP页面。恭喜你一个最基础的JSP项目环境已经跑通了5. 从静态到动态编写第一个Servlet与JSP5.1 创建并理解Servlet的作用现在我们来让项目“动”起来。在src/main/java下新建一个包例如com.example.web。在该包上右键New - Servlet。如果IDEA没有直接提供Servlet创建选项就选择Java Class然后手动继承javax.servlet.http.HttpServlet。我们创建一个简单的HelloServletpackage com.example.web; 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; import java.io.PrintWriter; WebServlet(/hello) // 这是关键定义了Servlet的访问URL路径 public class HelloServlet extends HttpServlet { Override protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException { // 设置响应内容类型和编码 resp.setContentType(text/html;charsetUTF-8); PrintWriter out resp.getWriter(); // 获取请求参数 String name req.getParameter(name); if (name null || name.trim().isEmpty()) { name 访客; } // 生成动态HTML out.println(!DOCTYPE html); out.println(html); out.println(headtitleServlet示例/title/head); out.println(body); out.println(h1你好, name !/h1); out.println(p这个页面由HelloServlet动态生成。/p); out.println(/body); out.println(/html); } }核心是WebServlet(/hello)这个注解。它取代了传统web.xml中的servlet-mapping配置告诉容器当用户访问http://localhost:8081/demo/hello时就由这个HelloServlet类的doGet方法来处理。5.2 改造JSP页面并引入动态元素现在我们来修改自动生成的index.jsp让它不仅能显示静态内容还能链接到我们的Servlet并展示一些简单的JSP动态特性。% page contentTypetext/html; charsetUTF-8 pageEncodingUTF-8 % !DOCTYPE html html head title我的第一个JSP项目主页/title style body { font-family: Arial, sans-serif; margin: 40px; } a { color: blue; text-decoration: none; } a:hover { text-decoration: underline; } /style /head body h1欢迎来到JSP学习页面/h1 p当前服务器时间strong% new java.util.Date() %/strong/p !-- JSP脚本表达式 -- % // JSP脚本片段可以写Java代码 String userAgent request.getHeader(User-Agent); boolean isMobile userAgent ! null (userAgent.contains(Mobile) || userAgent.contains(Android)); % p您正在使用em% isMobile ? 移动设备 : 桌面浏览器 %/em 访问本页。/p hr h2功能演示/h2 ul lia hrefhello访问HelloServlet无参数/a/li lia hrefhello?name张三访问HelloServlet带参数name张三/a/li /ul form actionhello methodget label forusername输入你的名字/label input typetext idusername namename placeholder请输入 button typesubmit提交问候/button /form hr p这是一个标准的JSP页面它混合了HTML、CSS和Java代码通过lt;% ... %gt;标签。/p /body /html这个JSP页面做了几件事使用% ... %直接输出动态内容当前时间。使用% ... %编写脚本片段处理业务逻辑判断访问设备。提供了链接和表单与之前创建的HelloServlet进行交互。5.3 重启与功能验证由于我们添加了新的Java类Servlet需要让IDEA重新部署一下。最稳妥的方式是点击Tomcat运行窗口的“重启”按钮红色方框旁边带弯箭头的那个或者先停止再运行。重启后刷新你的浏览器地址应为http://localhost:8081/demo/。你应该能看到更新后的主页显示了动态时间、设备类型以及两个链接和一个表单。点击“访问HelloServlet带参数”或输入名字后提交表单页面会跳转到http://localhost:8081/demo/hello?namexxx并显示Servlet生成的个性化问候。至此一个具备基本交互功能的动态Web应用就完成了。6. 深度排查根治404错误与其他常见问题即使按照步骤操作你也可能遇到问题。下面是我总结的几个最常见“坑位”及其解决方案。6.1 404错误的系统性排查流程看到“HTTP Status 404 – Not Found”别慌按以下顺序检查检查URL是否完全正确这是最最常见的错误。确认你的访问地址是http://localhost:端口号/应用上下文路径/资源路径。端口号 去IDEA的运行配置里确认Tomcat - Server标签页的HTTP端口。应用上下文路径 去IDEA的运行配置里确认Tomcat - Deployment标签页的Application context。它必须以/开头。资源路径 对于Servlet是WebServlet(“/xxx”)里定义的路径。对于JSP/HTML是它在webapp目录下的相对路径。注意大小写检查Tomcat控制台日志启动时有没有报错有没有deployed successfully的字样如果应用根本没部署成功肯定404。常见的部署失败原因包括编译错误看“Build”日志、依赖缺失比如Servlet API的JAR包没引入、web.xml格式错误。检查项目工件是否成功部署在IDEA的Project视图里展开External Libraries看看有没有Tomcat 9.0.x相关的库里面应该包含servlet-api.jar等。如果没有说明项目模块没有正确关联Tomcat的库。你需要File - Project Structure - Modules选中你的模块在Dependencies标签页添加Library-Tomcat 9.0.x。检查“Update”动作如果你修改了Java代码Servlet仅仅重启Tomcat可能不够。你需要点击IDEA运行工具栏上的“更新”按钮一个绿色的循环箭头或通过快捷键CtrlF10/CmdF10调出“Update”菜单选择Update classes and resources或Redeploy。6.2 其他高频问题与解决技巧问题现象可能原因解决方案控制台或页面中文乱码1. 文件编码不统一。2. Tomcat输出日志编码未设。3. Servlet/JSP响应未设编码。1. 统一项目所有文件编码为UTF-8File - Settings - Editor - File Encodings。2. 在Tomcat运行配置的VM options中添加-Dfile.encodingUTF-8。3. 确保Servlet和JSP都设置了resp.setContentType(“text/html;charsetUTF-8”);和pageEncoding”UTF-8″。修改JSP后刷新浏览器不生效Tomcat缓存了旧的JSP编译结果.java和.class文件。1. 重启Tomcat是最彻底的方法。2. 找到Tomcat工作目录在IDEA运行配置的Server标签页On frame deactivation选项下面有路径删除里面对应你项目的work子目录然后重启。“Cannot resolve symbol ‘HttpServlet’”项目缺少Servlet API依赖。确保已按6.1第3步添加了Tomcat库。或者如果你使用Maven在pom.xml中添加依赖scopeprovided/scope的javax.servlet:javax.servlet-api。Tomcat启动超时45秒应用部署或初始化太慢超过了默认45秒限制。在IDEA运行配置的Server标签页找到Startup/Connection选项卡将Startup超时时间如45改大比如120秒。端口被占用Address already in use8080或8081端口已被其他程序如另一个Tomcat、Skype等使用。1. 在运行配置中换一个端口如8090。2. 命令行查找占用端口的进程并结束它Windows:netstat -ano | findstr :8080Linux/macOS:lsof -i:8080。6.3 开发中的高效调试习惯善用日志不要只依赖System.out.println()。学习使用java.util.logging或更强大的Log4j2/SLF4J来记录不同级别的日志INFO, DEBUG, ERROR。浏览器开发者工具是利器按F12打开看Network标签页。这里能清晰看到每一个请求的URL、方法、状态码、响应头和响应体。404错误在这里一目了然。对于500内部服务器错误响应体里通常会有Tomcat抛出的异常堆栈信息这是定位代码错误的关键。理解“热部署”的界限IDEA的“Update”动作对于修改JSP文件通常是即时生效的因为JSP是运行时编译。但对于修改Servlet类、添加新的依赖库通常需要Redeploy或重启。了解这一点可以节省很多无效的等待时间。7. 项目优化与生产意识培养一个能跑起来的项目只是开始。要让项目更健壮、更易于维护你需要建立一些“生产意识”。7.1 引入Maven进行依赖管理手动管理JAR包是噩梦。强烈建议将项目转换为Maven项目。在项目根目录上右键选择Add Framework Support…勾选Maven。IDEA会生成一个pom.xml文件。一个基础的JSP项目pom.xml可能长这样?xml version1.0 encodingUTF-8? project xmlnshttp://maven.apache.org/POM/4.0.0 xmlns:xsihttp://www.w3.org/2001/XMLSchema-instance xsi:schemaLocationhttp://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd modelVersion4.0.0/modelVersion groupIdcom.example/groupId artifactIdmy-first-jsp-project/artifactId version1.0-SNAPSHOT/version packagingwar/packaging !-- 打包成WAR -- properties project.build.sourceEncodingUTF-8/project.build.sourceEncoding maven.compiler.source1.8/maven.compiler.source maven.compiler.target1.8/maven.compiler.target /properties dependencies !-- Servlet API由Tomcat提供所以scope是provided -- dependency groupIdjavax.servlet/groupId artifactIdjavax.servlet-api/artifactId version4.0.1/version scopeprovided/scope /dependency !-- JSTL标签库简化JSP中的逻辑 -- dependency groupIdjavax.servlet/groupId artifactIdjstl/artifactId version1.2/version /dependency /dependencies build finalName${project.artifactId}/finalName !-- 打包后的WAR文件名 -- plugins plugin groupIdorg.apache.maven.plugins/groupId artifactIdmaven-war-plugin/artifactId version3.3.2/version /plugin plugin groupIdorg.apache.maven.plugins/groupId artifactIdmaven-compiler-plugin/artifactId version3.11.0/version configuration source1.8/source target1.8/target /configuration /plugin /plugins /build /project引入Maven后你的项目结构会微调webapp目录会移动到src/main/webapp。所有依赖只需在pom.xml中声明Maven会自动从中央仓库下载。这为项目引入了标准化和可复现性。7.2 代码结构分层与MVC思想萌芽即使是一个小项目也要有良好的代码组织习惯。这为将来引入Spring MVC等框架打下基础。com.example.model 存放数据模型或JavaBean如User, Product。com.example.dao或com.example.repository 存放数据访问对象负责与数据库交互可以先写接口和模拟实现。com.example.service 存放业务逻辑层处理复杂的业务规则。com.example.web或com.example.controller 存放Servlet它们现在只负责接收请求、调用Service、转发请求到JSP视图。例如你的HelloServlet可以进化它从request获取参数后调用一个GreetingService来生成问候语然后将结果放入request属性中最后转发到一个专门的hello.jsp视图页面进行展示。这就是最原始的MVCModel-View-Controller模式。7.3 打包与独立部署开发完成后你需要将项目交付或部署到独立的Tomcat服务器上。在IDEA右侧边栏打开Maven工具窗口。展开你的项目 -Lifecycle。双击package。Maven会在target目录下生成一个my-first-jsp-project.war文件名字由pom.xml中的finalName决定。将这个WAR文件复制到独立Tomcat的webapps目录下。启动这个独立的Tomcat运行其bin/startup.bat它会自动解压WAR包并部署应用。访问http://独立服务器IP:端口/my-first-jsp-project即可。这个过程让你理解IDEA内置的Tomcat只是一个便捷的开发工具最终的应用需要脱离IDE独立运行。走完这一整套流程你收获的不仅仅是一个在IDEA里能运行的JSP项目。你理解了环境配置的每一个细节知道了项目结构为何如此设计掌握了Servlet和JSP如何协同工作更学会了当事情不按预期发展时如何像侦探一样一步步排查问题。这些技能和经验是任何框架教程都不会详细告诉你的但却是你从“会写代码”到“能搞定项目”的必经之路。下次当你再面对一个陌生的Web项目时这套从环境到部署的完整认知地图会让你心里有底从容不迫。
