SSM前后端交互 demo

2023-08-01 10:22:21 浏览数 (1)

刚开始学习SSM框架,看着各式各样的书,听着大佬们录的视频,貌似觉得很简单。但是亲自实践之后,就不会这么觉得了。

从github上拉了很多个项目下来,一个个花里胡哨,SSM框架结构命名各式各样,一个jsp网页或者java类就有成百上千行代码,而我什么都看不懂。

其实那个时候我只想搞懂SSM环境配置的逻辑,以及前端网页如何读取数据库中的数据(即前端网页显示数据库数据),因为jsp网页一旦能成功显示数据库中的数据,其他功能就可以以此类推,都是复制粘贴的事情了。

看不懂,没人教,然后面向搜索引擎的编程,最后写总结,已经是我长期以来的常态了。接着我就像做英语阅读那样,一行一行代码的去查,最后把意思串起来,得到了我的理解。当然我的理解不一定准确,欢迎大佬指正。

前端网页显示数据库数据大概分为以下八个步骤:

  1. 在web.xml中,使用<welcome-file-list>标签,设置默认打开的网页  /WEB-INF/views/login/test.jsp
  2. 在该前端网页 test.jsp 中增加一个按钮,按钮指向"<%=basePath%>/summary/test1.do"(<%=basePath%>后面再说)。
  3. 该地址被 web.xml 中的DispatcherServlet(拦截器)所拦截,只剩下 /summary/test1
  4. web.xml 将 /summary/test1 传送到 springmvc.xml ,接着springmvc.xml去扫描其管辖的包下有没有对应的controller类。
  5. 在controller类(后端Java类)中找到@RequestMapping(value = "/summary/test1")的方法,执行这个方法。
  6. 在方法中,使用model.addAttribute(),像前端页面传送从数据库读取的数据,并且返回一个字符串"login/test"
  7. 返回的字符串"login/test"在springmvc.xml的配置视图解析器(ViewResolver)中,加上前缀"/WEB-INF/views/",加上后缀".jsp",即组成了一个完整的网页地址,浏览器访问的就是这个地址,即"/WEB-INF/views/login/test.jsp"
  8. 前端网页 test.jsp通过 ${msg} 来获取后端发来的数据。

完整代码放在最后面,先大概讲一下每一步的逻辑思路


第一步

代码语言:javascript复制
    <welcome-file-list>
        <welcome-file>/WEB-INF/views/login/test.jsp</welcome-file>
    </welcome-file-list>

<welcome-file-list>标签字面上看起来是欢迎文件列表的意思,实际上我猜是默认加载项目的网页的意思。配置好这个,使用Tomcat运行,就会首先加载这个界面。


第二步

代码语言:javascript复制
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%
    String path = request.getContextPath();
    String basePath = request.getScheme()   "://"   request.getServerName()   ":"   request.getServerPort()   path;
%>
<html>
    <head>
        <title></title>
    </head>

    <body>
        <a href="<%=basePath%>/summary/test1.do">
            <button>按钮</button>
        </a>
        <h2>${msg}</h2>
    </body>
</html>

request.getSchema()可以返回当前页面使用的协议:  http request.getServerName()可以返回当前页面所在的服务器的名字:  localhost request.getServerPort()可以返回当前页面所在的服务器使用的端口: 8080; request.getContextPath()可以返回当前页面所在的应用的名字.如 /views/login/

总之就是要获取到该项目的网络路径。

接着,我们使用  href="<%=basePath%>/summary/test1.do"  指向这个地址。


第三步

代码语言:javascript复制
    <servlet>
        <servlet-name>dispatcherServlet</servlet-name>
        <servlet-class>org.springframework.web.servlet.DispatcherServlet</servlet-class>
        <init-param>
            <param-name>contextConfigLocation</param-name>
            <param-value>classpath:spring/springmvc.xml</param-value>
        </init-param>
    </servlet>

    <servlet-mapping>
        <servlet-name>dispatcherServlet</servlet-name>
        <url-pattern>*.do</url-pattern>
    </servlet-mapping>

DispatcherServlet就是传说中的拦截器,他能把第二步传来的  /summary/test1.do  ,拦截下来,去掉后缀 .do,并且把他发送到配置文件spring.mvc。


第四步

代码语言:javascript复制
<context:component-scan base-package="ypc.zwz.controller"/>

springmvc.xml 收到数据之后,扫描这个包下所有的类,寻找有没有和 /summary/test1 对应的方法。


第五、六步

代码语言:javascript复制
package ypc.zwz.controller;

import org.springframework.web.bind.annotation.RequestMapping;
import ypc.zwz.service.ArticleService;

@Controller
@RequestMapping(value = "/summary")
public class ArticleController {

    @Autowired
    private ArticleService articleService;

    @RequestMapping(value = "/test1")
    public String te(@RequestParam(value = "pageCode", defaultValue = "1", required = false) int pageCode, @RequestParam(value = "pageSize", defaultValue = "3", required = false) int pageSize, HttpServletRequest request, Model model) {
        Summary summary = articleService.findById(23);
        String str = summary.getR_content();
        model.addAttribute("msg",str);
        return "login/test";
    }
}

在ypc.zwz.controller包的ArticleController类中,找到与之对应的方法te();因为这个类@RequestMapping(value = "/summary"),类下的te方法@RequestMapping(value = "/test1"),组合起来就是 /summary/test1。所以执行这个方法。

先通过articleService.findById(23);即从Serive层读取数据库的信息(后面会给完整代码),再获取Summary类中的contnt属性,通过model.addAttribute("msg",str);方法发送至前端页面,前端页面可以通过"msg"这个键来获取到str这个值,最后向spring.mvc返回"login/test"这个字符串。


第七步

代码语言:javascript复制
    <bean class="org.springframework.web.servlet.view.InternalResourceViewResolver">
        <property name="prefix" value="/WEB-INF/views/"/>
        <property name="suffix" value=".jsp"/>
    </bean>

springmvc.xml 接收到返回来的"login/test"字符串,利用试图解析器(ViewResolver)加上前缀后缀,组成完整的地址"/WEB-INF/views/login/test.jsp",返回到web.xml,浏览器正常读取打开,就正常打开。


第八步

代码见第二步,在第六步中已经说明,使用msg使用这个键来获取到str这个值,所以使用 ${msg} ,就获取到了后端传过来的str的值。


关于为什么要把原本的网址搞得这么花里胡哨,可能是为了保密吧,比如你知道主页的网页地址,那么你直接访问这个网址,就可以跳过登入了(可能是这样的吧,我猜的

登入地址XXXXX/views/login.jsp

主页地址XXXXX/views/index.jsp

那我们直接访问主页地址,就可以跳过登入了

相反现在:

登入地址XXXXX/views/login.jsp

我们需要访问XXXXXX.do这个后端方法,返回主页

但是浏览器的网页还是显示XXXXXX.do

我们不知道主页的真正地址

所以可能大概也许就起到保密的作用了。


完整代码

test.jsp  路径: WEB-INF/views/login/test.jsp

代码语言:javascript复制
<%--
  Created by IntelliJ IDEA.
  User: zwz
  Date: 2020/2/17 0016
  Time: 7:39
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%
    String path = request.getContextPath();
    String basePath = request.getScheme()   "://"   request.getServerName()   ":"   request.getServerPort()   path;
%>
<html>
    <head>
        <title></title>
    </head>

    <body>
        <a href="<%=basePath%>/summary/test1.do">
            <button>按钮</button>
        </a>
        <h2>${msg}</h2>
    </body>
</html>

web.xml  路径:WEB-INF/web.xml

代码语言:javascript复制
<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
         xmlns="http://xmlns.jcp.org/xml/ns/javaee"
         xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee
             http://xmlns.jcp.org/xml/ns/javaee/web-app_3_1.xsd"
         version="3.1">

    <welcome-file-list>
        <welcome-file>/WEB-INF/views/login/test.jsp</welcome-file>
    </welcome-file-list>

    <!--配置spring的字符编码过滤器 -->
    <filter>
        <filter-name>CharacterEncoding</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>
    </filter>
    <filter-mapping>
        <filter-name>CharacterEncoding</filter-name>
        <url-pattern>/*</url-pattern>
    </filter-mapping>



<!--    spring 开始-->
    <!-- 加载spring的过滤器 -->
    <context-param>
        <param-name>contextConfigLocation</param-name>
        <param-value>classpath:spring/spring-*.xml</param-value>
    </context-param>
   <listener><!-- 启动web容器时,自动装配spring-dao.xml-->
        <listener-class>org.springframework.web.context.ContextLoaderListener</listener-class>
    </listener>
    <!--    spring 结尾-->


    <!--配置springmvc的核心过滤器 -->
    <servlet>
        <servlet-name>dispatcherServlet</servlet-name>
        <servlet-class>org.springframework.web.servlet.DispatcherServlet</servlet-class>
        <init-param>
            <param-name>contextConfigLocation</param-name>
            <param-value>classpath:spring/springmvc.xml</param-value>
<!--            容器启动自动加载springmvc.xml  -->
        </init-param>
    </servlet>
    <servlet-mapping>
        <servlet-name>dispatcherServlet</servlet-name>
        <url-pattern>*.do</url-pattern>
    </servlet-mapping>

</web-app>

spring-mvc.xml  路径: src/main/resources/spring/springmvc.xml

代码语言:javascript复制
<?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:aop="http://www.springframework.org/schema/aop"
       xmlns:tx="http://www.springframework.org/schema/tx"
       xmlns:mvc="http://www.springframework.org/schema/mvc"
       xmlns:context="http://www.springframework.org/schema/context"
       xsi:schemaLocation="http://www.springframework.org/schema/beans
        http://www.springframework.org/schema/beans/spring-beans.xsd
        http://www.springframework.org/schema/aop
         http://www.springframework.org/schema/aop/spring-aop.xsd
         http://www.springframework.org/schema/context
         http://www.springframework.org/schema/context/spring-context.xsd
         http://www.springframework.org/schema/tx
         http://www.springframework.org/schema/context/spring-tx.xsd
         http://www.springframework.org/schema/mvc
         http://www.springframework.org/schema/mvc/spring-mvc.xsd">

    <!-- 开启注解扫描 -->
    <context:component-scan base-package="ypc.zwz.controller"/>

    <!-- 配置springmvc的驱动,并开启了对JSON数据格式的支持 -->
    <mvc:annotation-driven/>

    <!-- 配置视图解析器 -->
    <bean class="org.springframework.web.servlet.view.InternalResourceViewResolver">
        <property name="prefix" value="/WEB-INF/views/"/>
        <property name="suffix" value=".jsp"/>
    </bean>


</beans>

spring-dao.xml  地址:  src/main/resources/spring/spring-dao.xml

代码语言:javascript复制
<?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"
       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">

    <!-- 配置注解扫描 -->
    <context:component-scan base-package="ypc.zwz.service"/>

    <!-- 加载数据库配置文件 -->
    <context:property-placeholder location="classpath:resource/jdbc.properties"/>

    <!-- 数据库连接池 -->
    <bean id="dataSource" class="com.mchange.v2.c3p0.ComboPooledDataSource">
        <!-- 配置数据库连接池属性 -->
        <property name="driverClass" value="${jdbc.driver}"/>
        <property name="jdbcUrl" value="${jdbc.url}"/>
        <property name="user" value="${jdbc.username}"/>
        <property name="password" value="${jdbc.password}"/>

        <!-- c3p0连接池私有属性 -->
        <property name="maxPoolSize" value="30"/>
        <property name="minPoolSize" value="10"/>
        <!-- 关闭连接后不自动commit -->
        <property name="autoCommitOnClose" value="false"/>
        <!-- 获取连接超时时间 -->
        <property name="checkoutTimeout" value="10000"/>
        <!-- 当获取连接失败后重新连接的次数 -->
        <property name="acquireRetryAttempts" value="2" />
    </bean>

    <!-- 配置SqlSessionFactory对象 -->
    <bean id="sqlSessionFactory" class="org.mybatis.spring.SqlSessionFactoryBean">
        <!-- 注入数据库连接池 -->
        <property name="dataSource" ref="dataSource"/>
        <!-- 启用mybatis的别名配置 -->
        <property name="typeAliasesPackage" value="ypc.zwz.pojo"/>
        <!-- 扫描Mapper层的配置文件 -->
        <property name="mapperLocations" value="classpath:ypc/zwz/mapper/*.xml"/>
    </bean>

    <!-- 启用mybatis的接口代理开发模式(接口和Xml配置必须同名,并且在同一目录下) -->
    <bean class="org.mybatis.spring.mapper.MapperScannerConfigurer">
        <property name="basePackage" value="ypc.zwz.mapper"/>
        <property name="sqlSessionFactoryBeanName" value="sqlSessionFactory"/>
    </bean>

</beans>

ArticleController.java  路径 :src/main/java/cn/ypc/controller/ArticleController.java

代码语言:javascript复制
package ypc.zwz.controller;

import ypc.zwz.pojo.Summary;
import ypc.zwz.service.ArticleService;

import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestParam;

import javax.servlet.http.HttpServletRequest;
import java.util.HashMap;
import java.util.List;
import java.util.Map;

@Controller
@RequestMapping(value = "/summary")
public class ArticleController {
    private ArticleService articleService;
    @RequestMapping(value = "/test1")
    public String te(@RequestParam(value = "pageCode", defaultValue = "1", required = false) int pageCode,@RequestParam(value = "pageSize", defaultValue = "3", required = false) int pageSize,HttpServletRequest request,Model model) {
        Summary summary = articleService.findById(23);
        String str = summary.getR_content();
        model.addAttribute("msg",str);
        return "login/test";
    }
}

0 人点赞