实验8

SpringMVC 实战练习：开发三角形计算器 + 全程排坑记录

大家好，最近完成了 SpringMVC 框架的上机实验，从零搭建了一个三角形计算器 Web 小项目。整个过程从环境搭建、文件配置、代码编写，再到解决端口占用、Jar 包异常、项目部署失败、404 访问错误等一系列问题，踩了不少典型的坑。本篇文章完整记录项目开发流程、核心配置、代码实现以及问题排查思路，既是个人学习复盘，也分享给正在学习 SpringMVC 的小伙伴。

一、项目概述

1. 技术栈

  • 开发工具：Eclipse IDE for Enterprise Java Developers
  • 运行环境：JDK 1.8
  • 服务器：Apache Tomcat 9.0
  • 核心框架：SpringMVC
  • 视图技术：JSP

2. 实现功能

  1. 前端 JSP 页面提供表单，接收用户输入的三角形三条边长；
  2. 后台接收参数，判断三条边能否合法构成三角形；
  3. 若可以构成三角形，使用海伦公式计算周长与面积；
  4. 将判断结果和计算数据回显到结果页面；
  5. 解决页面中文乱码、请求分发、页面跳转等基础 Web 问题。

3. 整体架构（MVC 分层思想）

本项目严格遵循 MVC 设计模式，三层职责划分清晰：

  • Model（模型层）：Triangle.java 实体类，封装边长属性、判断逻辑与计算逻辑；
  • Controller（控制层）：TriangleControl.java 控制器，接收浏览器请求、调用业务逻辑、控制页面跳转；
  • View（视图层）：input.jsp（输入页）、show.jsp（结果页），负责页面展示与数据渲染。

二、项目目录结构

先梳理完整项目结构，方便对照搭建：

springmvc （动态Web项目根目录）
├─ src
│  ├─ com.bean        // 实体类包
│  │  └─ Triangle.java
│  └─ com.control     // SpringMVC控制器包
│     └─ TriangleControl.java
└─ WebContent
   ├─ WEB-INF
   │  ├─ lib                  // SpringMVC所有依赖Jar包（必须放在根目录）
   │  ├─ pages                // 存放JSP视图页面
   │  │  ├─ input.jsp
   │  │  └─ show.jsp
   │  ├─ web.xml              // 项目全局部署描述文件
   │  └─ springmvc-servlet.xml// SpringMVC核心配置文件
   └─ index.jsp

重要提醒：所有 Spring 相关 Jar 包必须直接放在 WEB-INF/lib 下，不能嵌套子文件夹，否则 Tomcat 无法加载。

三、核心配置文件编写

SpringMVC 项目能否正常运行，配置文件是关键，下面贴出两份完整、可直接运行的配置代码。

1. 全局配置文件 web.xml

该文件主要配置：SpringMVC 前端控制器、中文乱码过滤器、默认欢迎页。

<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
    xmlns="http://java.sun.com/xml/ns/javaee"
    xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_3_0.xsd"
    version="3.0">

    <!-- 1. SpringMVC 前端控制器：拦截所有请求 -->
    <servlet>
        <servlet-name>springmvc</servlet-name>
        <servlet-class>org.springframework.web.servlet.DispatcherServlet</servlet-class>
        <!-- 服务器启动时就加载该Servlet -->
        <load-on-startup>1</load-on-startup>
    </servlet>
    <servlet-mapping>
        <servlet-name>springmvc</servlet-name>
        <!-- / 表示拦截浏览器所有请求 -->
        <url-pattern>/</url-pattern>
    </servlet-mapping>

    <!-- 2. 中文乱码过滤器：统一设置请求编码为UTF-8 -->
    <filter>
        <filter-name>encodingFilter</filter-name>
        <filter-class>org.springframework.web.filter.CharacterEncodingFilter</filter-class>
        <init-param>
            <param-name>encoding</param-name>
            <param-value>UTF-8</param-value>
        </init-param>
        <init-param>
            <param-name>forceEncoding</param-name>
            <param-value>true</param-value>
        </init-param>
    </filter>
    <filter-mapping>
        <filter-name>encodingFilter</filter-name>
        <url-pattern>/*</url-pattern>
    </filter-mapping>

    <!-- 默认欢迎页 -->
    <welcome-file-list>
        <welcome-file>index.jsp</welcome-file>
    </welcome-file-list>
</web-app>

2. SpringMVC 核心配置 springmvc-servlet.xml

文件名规则：servlet-name + -servlet.xml，本项目中固定为 springmvc-servlet.xml，放在 WEB-INF 下。
主要功能：组件扫描、开启注解、视图解析器、放行静态资源。

<?xml version="1.0" encoding="UTF-8"?>
<beans xmlns="http://www.springframework.org/schema/beans"
       xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
       xmlns:context="http://www.springframework.org/schema/context"
       xmlns:mvc="http://www.springframework.org/schema/mvc"
       xsi:schemaLocation="
           http://www.springframework.org/schema/beans
           http://www.springframework.org/schema/beans/spring-beans.xsd
           http://www.springframework.org/schema/context
           http://www.springframework.org/schema/context/spring-context.xsd
           http://www.springframework.org/schema/mvc
           http://www.springframework.org/schema/mvc/spring-mvc.xsd">

    <!-- 1. 组件扫描：自动扫描com.control包下的控制器类 -->
    <context:component-scan base-package="com.control"/>

    <!-- 2. 开启SpringMVC注解驱动，支持@RequestMapping等注解 -->
    <mvc:annotation-driven/>

    <!-- 3. 视图解析器：自动拼接页面路径，简化跳转代码 -->
    <!-- prefix：页面前缀路径  suffix：页面后缀 -->
    <bean class="org.springframework.web.servlet.view.InternalResourceViewResolver">
        <property name="prefix" value="/WEB-INF/pages/"/>
        <property name="suffix" value=".jsp"/>
    </bean>

    <!-- 4. 放行静态资源，防止静态文件被前端控制器拦截 -->
    <mvc:default-servlet-handler/>
</beans>

四、后端 Java 代码实现

1. 实体类 Triangle.java（Model 层）

封装三角形三条边，提供判断合法性、计算周长和面积的业务逻辑。

package com.bean;

public class Triangle {
    // 三条边长
    private double a;
    private double b;
    private double c;
    // 是否为合法三角形
    private boolean isTriangle;
    // 周长
    private double perimeter;
    // 面积
    private double area;

    // 无参构造（Spring参数封装必须）
    public Triangle() {}

    // 核心计算方法
    public void calculate() {
        // 三角形判定规则：任意两边之和大于第三边，且边长大于0
        if (a > 0 && b > 0 && c > 0 && (a + b > c) && (a + c > b) && (b + c > a)) {
            isTriangle = true;
            // 计算周长
            perimeter = a + b + c;
            // 海伦公式计算面积
            double p = perimeter / 2;
            area = Math.sqrt(p * (p - a) * (p - b) * (p - c));
        } else {
            isTriangle = false;
        }
    }

    // Getter & Setter 方法
    public double getA() {
        return a;
    }
    public void setA(double a) {
        this.a = a;
    }
    public double getB() {
        return b;
    }
    public void setB(double b) {
        this.b = b;
    }
    public double getC() {
        return c;
    }
    public void setC(double c) {
        this.c = c;
    }
    public boolean isTriangle() {
        return isTriangle;
    }
    public double getPerimeter() {
        return perimeter;
    }
    public double getArea() {
        return area;
    }
}

2. 控制器 TriangleControl.java（Controller 层）

使用 @Controller 注解声明为控制器，@RequestMapping 绑定请求路径。

package com.control;

import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.RequestMapping;
import com.bean.Triangle;

@Controller
public class TriangleControl {

    // 跳转到输入页面
    @RequestMapping("/input")
    public String showInput(){
        // 视图解析器自动拼接：/WEB-INF/pages/input.jsp
        return "input";
    }

    // 处理计算请求
    @RequestMapping("/calculate")
    public String calculate(Triangle triangle, Model model){
        // 执行计算逻辑
        triangle.calculate();
        // 将数据存入Model，转发到页面展示
        model.addAttribute("tri",triangle);
        return "show";
    }
}

五、前端 JSP 页面代码

1. 输入页面 input.jsp

提供表单，让用户输入三条边长，提交到 /calculate 请求地址。

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>三角形计算器</title>
</head>
<body>
    <h3>三角形边长输入</h3>
    <form action="calculate" method="post">
        边长A：<input type="number" name="a" step="0.01" required><br><br>
        边长B：<input type="number" name="b" step="0.01" required><br><br>
        边长C：<input type="number" name="c" step="0.01" required><br><br>
        <input type="submit" value="开始计算">
    </form>
</body>
</html>

2. 结果页面 show.jsp

使用 JSTL 标签判断结果，展示三角形信息或错误提示。

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<html>
<head>
    <title>计算结果</title>
</head>
<body>
    <h3>计算结果</h3>
    <c:if test="${tri.triangle}">
        <p>✅ 输入三边可以构成三角形</p>
        <p>三角形周长：${tri.perimeter}</p>
        <p>三角形面积：${tri.area}</p>
    </c:if>
    <c:if test="${!tri.triangle}">
        <p>❌ 输入三边无法构成三角形，请重新输入！</p>
    </c:if>
    <br>
    <a href="input">返回输入页面</a>
</body>
</html>

六、完整运行步骤

  1. 打开 Eclipse，新建 Dynamic Web Project，项目名 springmvc；
  2. 按照上面的目录结构，创建包、Java 类、JSP 页面；
  3. 将所有 SpringMVC 依赖 Jar 包放入 WEB-INF/lib，并添加到项目构建路径；
  4. 依次编写 web.xml 和 springmvc-servlet.xml 两份配置文件；
  5. 在 Eclipse 中配置 Tomcat 9.0 服务器，将项目部署到服务器；
  6. 右键 Tomcat → Clean 清理缓存，再点击 Start 启动服务器；
  7. 查看控制台日志，出现 Server startup in xxx ms 代表启动成功；
  8. 浏览器访问地址：http://localhost:8080/springmvc/input，进行功能测试。

七、开发过程遇到的问题及解决方案（重点排坑记录）

这是本次项目最耗时的部分，也是新手最容易出错的地方，逐一记录：

问题1：Tomcat 8080 端口被占用，服务器启动失败

现象：启动 Tomcat 提示端口冲突，无法正常监听。
原因：电脑上其他程序、残留 Tomcat 进程占用了默认 8080 端口。
解决办法：

  1. 打开 CMD 命令提示符；
  2. 执行命令查询占用进程：netstat -ano | findstr "8080"；
  3. 记下最后一列 PID 进程号；
  4. 结束进程：taskkill /PID 进程号 /F；
  5. 重新启动 Tomcat 即可。

备选方案：直接修改 Tomcat 端口为 9090、8081 等。

问题2：Jar 包出现红色叉号，项目报错

现象：WEB-INF/lib 下的 Jar 包全部带红叉，类无法识别。
原因：

  1. Jar 包放在 lib 的子文件夹中，Tomcat 不加载子目录 Jar；
  2. 移动文件后，Eclipse 构建路径引用失效。
    解决办法：
  3. 把所有 Jar 包剪切到 WEB-INF/lib 根目录，删除多余子文件夹；
  4. 右键项目 → Build Path → Configure Build Path；
  5. 删除所有带红叉的旧 Jar 引用；
  6. 重新 Add JARs，选中 lib 下所有 Jar 包添加进来。

问题3：项目部署失败，控制台提示 Context[/springmvc] 启动失败

现象：Tomcat 启动成功，但项目加载失败。
原因：web.xml 中过滤器、Servlet 配置错误，或 Jar 包缺失。
解决办法：

  1. 临时注释掉过滤器代码，测试项目能否启动；
  2. 检查所有 Jar 包是否完整、无红叉；
  3. 清理 Tomcat 工作目录与缓存，重新发布项目。

问题4：浏览器访问出现 404 页面找不到

现象：地址正确但页面无法访问。
原因：

  1. SpringMVC 配置文件扫描包名与实际包名不一致；
  2. 视图解析器路径、JSP 存放路径不匹配；
  3. 控制器请求地址书写错误。
    解决办法：
  4. 核对 springmvc-servlet.xml 中 base-package 与控制器包名完全一致；
  5. 检查视图解析器 prefix 路径和 JSP 真实存放路径；
  6. 查看控制台日志，确认 /input、/calculate 请求是否被正常映射。

问题5：XML 配置文件标签、命名空间报错

现象：XML 文件标红，框架无法解析配置。
原因：命名空间地址被截断、标签书写不全。
解决办法：直接使用文中完整的 XML 代码，不要手动简写命名空间与类名。

八、项目运行效果

  1. 访问首页后，正常展示边长输入表单；
  2. 输入 3、4、5 等合法边长，页面正常计算并展示周长、面积；
  3. 输入 1、2、4 等不合法边长，页面提示无法构成三角形；
  4. 页面无中文乱码，跳转、提交功能全部正常。

九、学习总结与个人感悟

本次使用 SpringMVC 开发三角形计算器，是一次非常完整的 Java Web 入门实战。从理论到落地，我真切体会到 MVC 分层模式的优势：职责分离、代码清晰、便于后期维护。

SpringMVC 框架简化了原生 Servlet 的大量重复代码，通过注解和配置实现请求分发与视图跳转，但配置文件的严谨性是框架运行的前提，一个字符、一条路径出错，都会导致项目瘫痪。

整个排错过程虽然繁琐，但也是提升调试能力最快的方式。学会看懂 Tomcat 控制台日志、使用命令排查端口、处理 Jar 包依赖问题，这些经验在后续 Web 开发中都非常实用。

后续我会继续深入学习 SpringMVC 进阶功能、拦截器、数据校验等内容，不断积累实战经验。也希望这篇详细的笔记能帮到正在学习框架的同学，大家一起进步！

posted @ 2026-05-31 01:12  小牙不会写代码  阅读(25)  评论(0)    收藏  举报