SpringBoot整合JSP

SpringBoot整合JSP

1.1项目创建

1.1.1创建项目

在这里插入图片描述

1.1.2编辑.pom文件 添加继承/依赖/插件

<!--parent标签作用:管理所有被springBoot整合之后的jar包的版本定义 springBoot特点: 开箱即用 引入jar包就可以添加相对应的功能. 
		定义了当前springBoot2.3.1所有的相关依赖的版本号信息. -->
	<parent>
		<groupId>org.springframework.boot</groupId>
		<artifactId>spring-boot-starter-parent</artifactId>
		<version>2.3.1.RELEASE</version>
		<relativePath /> <!-- lookup parent from repository -->
	</parent>

	<properties>
		<java.version>1.8</java.version>
		<!--指定插件版本 -->
		<maven-jar-plugin.version>3.1.1</maven-jar-plugin.version>
		<!--跳过测试类打包 -->
		<skipTests>true</skipTests>
	</properties>

	<dependencies>
		<!--在webjar包的内部关联整合了所有的springMVC的jar包信息. 所以只需要引入一个jar包,则可以关联整合所有的有关mvc的依赖包信息 -->
		<dependency>
			<groupId>org.springframework.boot</groupId>
			<artifactId>spring-boot-starter-web</artifactId>
		</dependency>

		<dependency>
			<groupId>org.springframework.boot</groupId>
			<artifactId>spring-boot-starter-test</artifactId>
			<scope>test</scope>
			<exclusions>
				<exclusion>
					<groupId>org.junit.vintage</groupId>
					<artifactId>junit-vintage-engine</artifactId>
				</exclusion>
			</exclusions>
		</dependency>

		<!--添加属性注入依赖 -->
		<dependency>
			<groupId>org.springframework.boot</groupId>
			<artifactId>spring-boot-configuration-processor</artifactId>
			<optional>true</optional>
		</dependency>

		<!--支持热部署 -->
		<dependency>
			<groupId>org.springframework.boot</groupId>
			<artifactId>spring-boot-devtools</artifactId>
		</dependency>

		<!--引入插件lombok 自动的set/get/构造方法插件 -->
		<dependency>
			<groupId>org.projectlombok</groupId>
			<artifactId>lombok</artifactId>
		</dependency>

		<!--引入数据库驱动 -->
		<dependency>
			<groupId>mysql</groupId>
			<artifactId>mysql-connector-java</artifactId>
			<scope>runtime</scope>
		</dependency>

		<!--springBoot数据库连接 -->
		<dependency>
			<groupId>org.springframework.boot</groupId>
			<artifactId>spring-boot-starter-jdbc</artifactId>
		</dependency>

		<!--spring整合mybatis-plus -->
		<dependency>
			<groupId>com.baomidou</groupId>
			<artifactId>mybatis-plus-boot-starter</artifactId>
			<!--最新版本包 -->
			<version>3.3.2</version>
		</dependency>
	</dependencies>

	<!--负责项目打包 更新 maven操作相关的配置 必须添加 -->
	<build>
		<plugins>
			<plugin>
				<groupId>org.springframework.boot</groupId>
				<artifactId>spring-boot-maven-plugin</artifactId>
			</plugin>
		</plugins>
	</build>

1.1.3 将页面资料导入webapp

在这里插入图片描述

1.1.4导入资源文件

在这里插入图片描述

<!--springBoot整合JSP添加依赖  -->
		<!--servlet依赖 -->
		<dependency>
			<groupId>javax.servlet</groupId>
			<artifactId>javax.servlet-api</artifactId>
		</dependency>

		<!--jstl依赖 -->
		<dependency>
			<groupId>javax.servlet</groupId>
			<artifactId>jstl</artifactId>
		</dependency>

		<!--使jsp页面生效 -->
		<dependency>
			<groupId>org.apache.tomcat.embed</groupId>
			<artifactId>tomcat-embed-jasper</artifactId>
		</dependency>

1.1.5修改yml配置文件

#Spring
spring:
  datasource:
    #数据库驱动 高版本 cj
    #低版本  com.mysql.jdbc.Driver
    driver-class-name: com.mysql.cj.jdbc.Driver
    url: jdbc:mysql:///jtdb?serverTimezone=GMT%2B8&userUnicode=true&
      characterEncoding=utf8&autoReconnect=true&allowMultiQueries=true
    username: root
    password: root
    
  mvc:         #引入mvn配置
    view:
      prefix: /WEB-INF/     # /默认代表根目录 src/main/webapp
      suffix: .jsp

1.2实现用户列表的展现

1.2.1业务要求

用户通过http://loacalhost:8080/findAll请求,则可以跳转到userList.jsp页面中,并且在页面中展现user表中的所有记录

1.2.2编辑UserController

@Controller
public class UserController {
	
	@Autowired
	private UserMapper userMapper;
	
	
	/**
	 * 查询user表的记录
	 * 1.url地址: localhost:8090/findAll
	 * 2.参数: 无
	 * 3.返回值结果: 页面逻辑名称
	 * 
	 * jsp中页面取值信息 : ${userList}  同步查询
	 * 
	 * 2.作业2.利用ajax形式动态展现页面数据.
	 * 
	 * 说明: 
	 * 		1. @Controller  + 返回值 String  表示跳转页面   
	 * 					必然经过视图解析器  拼接前缀和后缀
	 * 		
	 *      2. @RestController +任意返回值   直接返回JSON数据,不经过视图解析器.
	 *         或者  
	 *         @Controller +@ ResponseBody 
	 */
	
	@RequestMapping("/findAll")
	public String  findAll(Model model) {
		List<User>  userList = userMapper.selectList(null);
		model.addAttribute("userList", userList);
		return "userList"; //jsp html js 
		//  /WEB-INF/userList.jsp  拼接页面真实路径
	}
	
}
`
## 1.2.3页面效果展现
![在这里插入图片描述](https://img-blog.csdnimg.cn/20200706135321738.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2dvb2RtYW5fMDE=,size_16,color_FFFFFF,t_70)
## 1.3 SpringMVC调用流程
![在这里插入图片描述](https://img-blog.csdnimg.cn/20200706135353711.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2dvb2RtYW5fMDE=,size_16,color_FFFFFF,t_70)
## 1.4ajax展现用户列表
## 1.4.1 ajax原理
ajax特点:局部刷新,异步访问
知识点:ajax为什么可以异步? 源于ajax设计调用方式 (ajax引擎)
同步特点:当服务器正忙时,用户处于等待状态
异步特点:
![在这里插入图片描述](https://img-blog.csdnimg.cn/20200706125519666.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2dvb2RtYW5fMDE=,size_16,color_FFFFFF,t_70)
## 1.4.2 跳转ajax页面

```java
/**
	 * 实现页面跳转
	 */
	@RequestMapping("/ajax")
	public String ajax() {
		
		return "ajax";
	}

1.4.3 引入jQuery.js

将下载好的jQuery复制到项目中
在这里插入图片描述

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值