《超市订单管理系统》-SSM框架的学习与应用(Spring + Spring MVC + MyBatis)-Java EE企业级应用开发学习记录（第十二天）三个框架的整合，进行Web项目开发

《超市订单管理系统》-SSM框架的学习与应用(Spring + Spring MVC + MyBatis)-Java EE企业级应用开发学习记录（第十二天）三个框架的整合，进行Web项目开发

其实我们昨天的项目也已经初步整合的三个框架，只差最后一步就是对应的控制器controller编写，以及数据传值等。各位读者可以自己去尝试一下，那么我们今天要进行全新的Web项目开发。

有以下几个选题：

1.超市订单管理系统（先开发这个，将前面学过的全部知识都串起来）

2.学生信息管理系统

3.二手书店售卖系统

（我都会发出文章来讲解整个项目，帮助读者中的各位初学者从0到1的完成整个项目）

---

一、基于SSM的超市订单管理系统-开发第一天

运行环境： 该系统需要以下运行环境：

• Java环境： Jdk8或更高版本。
• Web容器： 支持Servlet 3.0规范的容器，如Apache Tomcat7。
• 数据库： MySQL8.0关系型数据库管理系统。
• 开发工具： IntelliJ IDEA等集成开发环境。
• 前端技术： HTML、CSS、JavaScript、Bootstrap等用于构建用户界面。
• 框架和库： Spring框架、Spring MVC、MyBatis等用于构建应用程序的后端和数据访问层。

项目背景：随着电子商务的快速发展和消费者对在线购物的需求不断增加，超市和零售店铺也需要适应这一变化。传统的超市和零售业务已经意识到，在线订单管理系统是提高效率、满足客户需求以及扩展市场份额的重要工具。这个背景下，我们创建了基于SSM技术栈的超市订单管理系统，该系统的目标是为超市提供一个全面的解决方案，使其能够适应市场变化，提高竞争力，并在数字化时代保持竞争力。

项目简介： 基于SSM（Spring + Spring MVC + MyBatis）技术栈开发的超市订单管理系统，旨在帮助开发者和学习者了解如何使用SSM框架构建复杂的企业级Web应用程序。通过学习这个资源，您将深入了解订单管理系统的设计、开发和部署过程，以及如何应用SSM框架来实现各种功能和特性。

应用场景： 该超市订单管理系统适用于各种零售业和电子商务应用场景，包括但不限于：

1. 超市零售管理：用于传统超市或零售商店的订单和库存管理，提供实时库存跟踪和订单处理。
2. 电子商务平台：作为电子商务网站的核心，支持商品目录管理、用户订单处理和在线支付。

---

第一天目标：

1. 使用Maven方式创建Web项目
2. 实现Spring MVC的数据绑定（也就是前后端传递值）
3. 实现系统的登录功能‘

这些都是前面我们有讲过的，那么这就开始今天的任务吧。

---

任务一、使用Maven方式创建Web项目

①使用Maven方式创建Jave Web项目，这里我们命名为：SuperMarket

新建完的项目是这样的，其他依赖和配置文件全无。

---

②编写Pom.xml文件，引入项目依赖

这里的话，除了一些框架依赖的版本跟我们昨天的不一致，其他的大致都相同，代码如下

<project xmlns="http://maven.apache.org/POM/4.0.0"
         xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
         xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd">
    <modelVersion>4.0.0modelVersion>

    <groupId>org.examplegroupId>
    <artifactId>SuperMarketartifactId>
    <version>1.0-SNAPSHOTversion>


    
    <packaging>warpackaging>

    <build>
        <resources>
            <resource>
                <directory>src/main/javadirectory>
                <includes>
                    <include>**/*.propertiesinclude>
                    <include>**/*.xmlinclude>
                includes>
                <filtering>truefiltering>
            resource>
        resources>
        <plugins>
            
            <plugin>
                <groupId>org.apache.maven.pluginsgroupId>
                <artifactId>maven-compiler-pluginartifactId>
                <version>3.8.1version>
                <configuration>
                    <source>1.8source>
                    <target>1.8target>
                configuration>
            plugin>


            
            <plugin>
                <groupId>org.apache.tomcat.mavengroupId>
                <artifactId>tomcat7-maven-pluginartifactId>
                <version>2.2version>
                <configuration>
                    <port>8080port>
                    <path>/path>
                    <uriEncoding>UTF-8uriEncoding>
                    <server>tomcat7server>
                configuration>
            plugin>
        plugins>
    build>

    <properties>
        <project.build.sourceEncoding>GBKproject.build.sourceEncoding>
    properties>




    <dependencies>
        <dependency>
            <groupId>org.mybatisgroupId>
            <artifactId>mybatisartifactId>
            <version>3.5.2version>
        dependency>
        
        <dependency>
            <groupId>mysqlgroupId>
            <artifactId>mysql-connector-javaartifactId>
            <version>8.0.11version>
        dependency>
        
        <dependency>
            <groupId>junitgroupId>
            <artifactId>junitartifactId>
            <version>4.12version>
            <scope>compilescope>
        dependency>
        
        <dependency>
            <groupId>log4jgroupId>
            <artifactId>log4jartifactId>
            <version>1.2.17version>
        dependency>
        
        
        <dependency>
            <groupId>org.springframeworkgroupId>
            <artifactId>spring-coreartifactId>
            <version>5.2.8.RELEASEversion>
        dependency>
        
        
        <dependency>
            <groupId>org.springframeworkgroupId>
            <artifactId>spring-beansartifactId>
            <version>5.2.8.RELEASEversion>
        dependency>
        
        
        <dependency>
            <groupId>org.springframeworkgroupId>
            <artifactId>spring-contextartifactId>
            <version>5.2.8.RELEASEversion>
        dependency>
        
        
        <dependency>
            <groupId>org.springframeworkgroupId>
            <artifactId>spring-expressionartifactId>
            <version>5.2.8.RELEASEversion>
        dependency>

        <dependency>
            <groupId>org.springframeworkgroupId>
            <artifactId>spring-txartifactId>
            <version>5.3.19version>
        dependency>

        <dependency>
            <groupId>org.springframeworkgroupId>
            <artifactId>spring-jdbcartifactId>
            <version>5.3.19version>
        dependency>
        
        
        <dependency>
            <groupId>org.mybatisgroupId>
            <artifactId>mybatis-springartifactId>
            <version>2.0.1version>
        dependency>

        
        <dependency>
            <groupId>commons-logginggroupId>
            <artifactId>commons-loggingartifactId>
            <version>1.2version>
        dependency>
        
        
        <dependency>
            <groupId>org.springframeworkgroupId>
            <artifactId>spring-aopartifactId>
            <version>5.2.8.RELEASEversion>
        dependency>
        
        
        <dependency>
            <groupId>org.aspectjgroupId>
            <artifactId>aspectjrtartifactId>
            <version>1.9.1version>
        dependency>
        
        
        <dependency>
            <groupId>org.aspectjgroupId>
            <artifactId>aspectjweaverartifactId>
            <version>1.9.6version>
        dependency>
        
        <dependency>
            <groupId>commons-poolgroupId>
            <artifactId>commons-poolartifactId>
            <version>1.6version>
        dependency>
        
        
        <dependency>
            <groupId>commons-dbcpgroupId>
            <artifactId>commons-dbcpartifactId>
            <version>1.4version>
        dependency>
        
        
        <dependency>
            <groupId>org.apache.commonsgroupId>
            <artifactId>commons-dbcp2artifactId>
            <version>2.0.1version>
        dependency>
        
        
        <dependency>
            <groupId>org.springframeworkgroupId>
            <artifactId>spring-webmvcartifactId>
            <version>5.2.8.RELEASEversion>
        dependency>
        
        
        <dependency>
            <groupId>javax.servletgroupId>
            <artifactId>javax.servlet-apiartifactId>
            <version>3.1.0version>
            <scope>providedscope>
        dependency>
        
        
        <dependency>
            <groupId>javax.servlet.jspgroupId>
            <artifactId>jsp-apiartifactId>
            <version>2.1version>
            <scope>providedscope>
        dependency>

        <dependency>
            <groupId>org.apache.taglibsgroupId>
            <artifactId>taglibs-standard-specartifactId>
            <version>1.2.5version>
        dependency>
        
        <dependency>
            <groupId>org.apache.taglibsgroupId>
            <artifactId>taglibs-standard-implartifactId>
            <version>1.2.5version>
        dependency>
    dependencies>


project>

编写完成以后，记得要刷新maven引入依赖文件。

---

③配置文件编写：创建好webapp文件夹和WEB-INF文件夹，以及其他的框架配置xml文件

例如mybatis-config.xml、springmvc-servlet.xml、spring-config.xml、web.xml、log4j.properties、db.properties等

1. mybatis-config.xml：MyBatis配置文件。用于配置MyBatis持久层框架，包括数据库连接、映射文件的位置等。
2. springmvc-servlet.xml：Spring MVC配置文件。用于配置Spring MVC框架，包括控制器的映射、视图解析器、拦截器等。
3. spring-config.xml：Spring配置文件。用于配置Spring框架，包括Bean的定义、依赖注入、AOP配置等。
4. web.xml：Web应用程序部署描述符。是Java Web应用程序的配置文件，其中包括Servlet、Filter、Listener的配置，以及URL映射等。
5. log4j.properties：Log4j配置文件。用于配置Log4j日志框架，包括日志输出格式、输出目标、日志级别等。
6. db.properties：数据库配置文件。用于配置数据库连接的相关信息，如数据库URL、用户名、密码等。

这里创建webapp文件夹和其他的配置文件前面的文章都有，想要了解的可以去看。

嫌麻烦的可以直接下载项目资源文件，里面都是配套好的了，并且写上了注释帮助理解。

如图，基本的项目结构是这样的，记得这里的配置文件，要根据自己的项目配置进行修改。

简单运行一下项目，查看一下是否部署成功

然后再重新运行Maven插件就可以运行起tomcat服务了，但是这里先缓缓，等会再进行。

---

④创建项目结构如下，还是使用驼峰命名方式

这里我们除了controller包下新建了一个UserController控制器，其他都还是空包。

先创建一个控制器，看看前后端的传值测试，能不能正常的根据预期网址映射跳转出我们想要的页面。

PS：这里要注意我们的包结构要与springmvc-servlet.xml中设置的扫描包结构一致

不然后面报错就会提示找不到controller

UserController代码如下：

package com.steveDash.controller;

import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;

@Controller
public class UserController {
    @RequestMapping("/default")
    public String hello(){
        System.out.println("访问到Controller");
        return "default";
    }
}

再根据我们pom设置好的tomcat插件配置如下：

俩者组合起来：我们的预期网址就是http://localhost:8080/SuperMarket/deafult,即可访问我们的default页面。

⑤接下来,在webapp/WEB-INF/pages下创建default.jsp页面，用于测试页面显示

<%--
  Created by IntelliJ IDEA.
  User: Administrator
  Date: 2023/9/13
  Time: 16:53
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>


    


你好呀，Stevedash的各位读者
点击进行Java学习

这样子就可以了。

---

⑥使用maven插件运行tomcat部署Web应用进行测试

前面的文章也是有详细讲解的，这里就不讲了。直接运行

然后在这个终端往上面翻一下，就可以看到部署后的起始网址了，也有根路由这一说法。

这里直接点击跳转，就是我们部署起来的根网址路由了。看着是不是跟我们前面预期的一样？

这里的话很正常，因为我们还没有进行传值，所以没办法定位到我们想要跳转的页面，所以显示404。但是呢，我们前面写了一个测试的controller，那就是default，输入进行测试看看

可以看到这跟我们预期的是一毛一样，那么说明部署正确。因此，到这里的话呢，任务一：使用Maven方式创建Web项目已经完成，并且项目能够正常启动部署在tomcat上了。

---

任务二、实现Spring MVC的数据绑定（也就是前后端传递值）

那么如何进行一个前后端传递值呢？在项目开发中很多的时候需要用输入框，然后用POST方式向后端传值。就是典型的搜索框，请输入xxx然后搜索，那我们就来进行一个简单的传值操作。

①创建一个searchUser.jsp,里面创建一个表单，用POST方式进行传值

代码如下：

<%--
  Created by IntelliJ IDEA.
  User: Administrator
  Date: 2023/9/13
  Time: 19:22
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>


    



    请输入要搜索的用户名：
    
    

这里代码稍微解释一下：form标签说明这是一个表单，action指的是点击按钮后转向的网址，这里${pageContext.request.contextPath}表示的是网址根目录/根路由,/dosearchUser表示点击搜索提交后转向的页面。

---

②创建一个result.jsp，用来接收从searchUser.jsp页面传过来的username

<%--
  Created by IntelliJ IDEA.
  User: Administrator
  Date: 2023/9/13
  Time: 20:06
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>


    



你要查找的用户${username}在2班

${username}用来接收传递过去来的username这个属性的值。

---

③在UserController添加对应的网址映射路径

@RequestMapping("/searchUser")
public String search(){
    System.out.println("欢迎访问搜索页");
    return "searchUser";
}

@RequestMapping("/dosearchUser")
public String searchUser(@RequestParam("username") String username, Model model){
    System.out.println("用户想要查询的用户名是："+username);
    model.addAttribute("username",username);//把值放到model中传到前端
    return "result";
}

这里的代码意思是：

​ 这段代码是一个简单的Spring MVC控制器，它接受用户的HTTP请求，处理请求中的参数，然后返回相应的视图。在搜索页面上，用户输入用户名，然后点击按钮，该用户名将作为参数传递到searchUser()方法中，在result视图中显示出来。

​ @RequestParam是Spring MVC注解，用于从HTTP请求中获取参数的值。在这里，它从请求中获取名为"username"的参数，并将其存储在username变量中

​ Model是Spring MVC框架提供的一个对象，用于向视图传递数据。在这里，model.addAttribute("username", username)将username的值存储在模型中，以便在视图中使用。

---

④运行tomcat服务进行测试，我们编写的程序是否能正确的传值

其他传值也是基本上一样的。这里的话还有一个小知识点：web.xml中我们设置了一部分代码用于识别资源文件和处理解决表单中文乱码的问题。

那顺便再讲一个吧，我们前面在web.xml中设置了一个默认的页面展示，就是将打开网站的根目录替换成我们想要展示的一个页面。

这里的话呢，因为我们的default.jsp是在pages文件夹下的，因此没办法找到。

所以我们要修改一下路径：

文件的路径对应起来，然后重新运行服务就可以看到变化了。

已经修改成功了。

---

三、实现超市订单管理系统的用户登录功能

​ 好这里的话，就正常开始了项目开发。实现登录功能之外，还得要制作出精美的登录页面，这里涉及到前端的网页技术，就不细讲，前端有很多模板可以直接套用的。所以可以自己创作出属于自己的UI设计。

①引入项目前端可能会需要的statics静态资源包，置于webapp目录下

如图：与WEB-INF在同一级目录中

---

②编写login.jsp，登录页面，代码如下

<%--
  Created by IntelliJ IDEA.
  User: Administrator
  Date: 2023/9/13
  Time: 22:25
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>


    
    
    
    



    

        
超市订单管理系统
    
    

        

            
${error }
            

                <%--@declare id="user"--%>帐号：
                
            
            

                <%--@declare id="mima"--%>密码：
                
            
            

                
                
            
        
    

可以看到我们这里为了页面的美观，引用了statics中的一些CSS样式。

---

③在控制层UserController中编写/login的映射注册login页面，还有编写/dologin的映射进行登录转向

@RequestMapping(value="/login")
public String showLoginPage(){
    System.out.println("进入登录页面");
    return "login";
}

@RequestMapping(value="/dologin")
public String doLogin(@RequestParam("userCode") String userCode, @RequestParam("userPassword") String userPassword, Model model, HttpSession session){
    //读取用户和密码
    System.out.println("帐号和密码是"+userCode+"-"+userPassword);
    if(userCode.equals("stevedash")&&userPassword.equals("123")){
       session.setAttribute("userCode",userCode);//添加session值
        return "welcome"; //密码正确就去welcome.jsp
    }else{
        //登录失败就回到login.jsp
        model.addAttribute("error", "用户名或密码不正确");
        return "login";
    }
}

代码解释：

/login映射：/login映射用于展示登录页面。

/dologin映射：通常，/dologin映射用于处理用户的登录请求。

​ 上面的方法用于处理用户提交的登录表单，验证用户名和密码。如果验证成功，可以执行登录操作并重定向到welcome页面。如果验证失败，可以返回登录页面并且显示错误信息error。

​ 这里我们使用了Session，是为了在网页中使用全局变量Session，让后面其他的页面也能使用到用户名这些全局变量。

​ 这里我们进行简单操作，因为读取用户和密码要对照数据库进行读取，要涉及到spring+mybatis的整合，因此现在先简单处理，完成页面的正确转向，再完善业务逻辑。

---

④编写welcome.jsp登录成功展示页面

welcome是我们登录成功后的展示页面，因此需要制作精美点，不可以太简约简单。良好的用户体验也是一个合格项目的标准。

<%--
  Created by IntelliJ IDEA.
  User: Administrator
  Date: 2023/9/13
  Time: 22:41
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@include file="/WEB-INF/pages/common/head.jsp"%>

    
    

        
${sessionScope.userCode}
        
欢迎来到超市订单管理系统!
    


<%@include file="/WEB-INF/pages/common/foot.jsp" %>

代码解释：

​ 我们这里使用了<%@include file=" "%>,通过这种方式，把通用的页面部分head头部页面和foot底部页面嵌入到我们的主页面中，实现代码的重用和维护的便利性。这对于保持页面的一致性和减少代码冗余非常有用。

​ <%@ page contentType="text/html;charset=UTF-8" language="java" %> ,表示设置该JSP页面的内容类型（contentType），语言（language）以及字符编码（charset）。

​ 这部分设置了页面的内容类型为HTML（text/html），并指定了字符编码为UTF-8。这意味着该JSP页面将生成HTML内容，并使用UTF-8字符编码，这是一种常用于处理多语言字符的编码方式。

​ 有助于确保生成的HTML页面在浏览器中正确地呈现，并且字符编码正确处理，以避免出现乱码等问题。这是编写符合国际化和多语言要求的JSP页面时常见的设置。

---

⑤pages下创建common文件夹，然后创建foot.jsp和head.jsp

foot.jsp代码如下：

<%--
  Created by IntelliJ IDEA.
  User: Administrator
  Date: 2023/9/13
  Time: 23:03
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>

    Java SSM教学

head.jsp代码如下：

<%--
  Created by IntelliJ IDEA.
  User: Administrator
  Date: 2023/9/13
  Time: 23:03
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>



    
    
    
    




    
超市订单管理系统
    

        
下午好！ ${sessionScope.userCode} , 欢迎你！
        退出
    



         2023年9月13日 23:11  星期三
    温馨提示：为了能正常浏览，请使用高版本浏览器！（Google Or Firefox)



    

        
功能列表 
        

            

                
订单管理
                
供应商管理
                
用户管理
                
密码修改
                
退出系统
            
        
    
    
    "/>

可以看到，这里也使用了session全局变量，${sessionScope.userCode} 欢迎你！，用来获取用户名。

---

⑥修改超时订单管理系统的首页为login，这样可以直接进行登录操作

在web.xml进行欢迎首页的修改，这里我的注释，没改别被影响了。

---

⑦保存所有的项目文件，使用maven插件运行tomcat服务

直接点击图中的http://localhost:8080/SuperMarket进行访问测试

这是我们的登录页面

⑧进行数据测试，输入错误的用户和密码查看是否会出现对应的错误提示

可以看到成功提示，需求满足。

---

⑨那么尝试输入正确账号和密码，进行登录请求测试

可以看到正确跳转，且无乱码情况，显示正常。

并且welcome和head.jsp页面中都成功获取了Session全局变量userCode。

---

总结

​ 昨天刚学完初认SpringMVC框架，今天就行完全的项目开发，总体项目框架已经搭建好了。所以接下来我们只需要将前几天讲过的Spring+Mybatis框架整合进来，对数据表user进行读取，然后判断用户名和密码是否与数据库中记录的一致。即可实现真正的登录功能！通过今天的学习，希望各位读者可以对整体的项目开发流程有个大致的了解，为框架开发打下坚实基础。

​ 想要跟着学习的可以去我的资源里面找对应的文件下载，我的md文件也会发上去，项目文件会上传可以自己跟着学习一下。

作者：Stevedash

发表于：2023年9月14日 1点23分

注：本文内容基于个人学习理解，如有错误或疏漏，欢迎指正。感谢阅读！如果觉得有帮助，请点赞和分享。