SpringBoot----web开发,实现简单的页面交互(结果返回freemarker页面)

SpringBoot----web开发,实现简单的页面交互(结果返回freemarker页面)

1、新建一个Maven项目,在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.0</modelVersion>

	<groupId>com.etc</groupId>
	<artifactId>springboot2</artifactId>
	<version>0.0.1-SNAPSHOT</version>
	<packaging>jar</packaging>

	<name>springboot2</name>
	<url>http://maven.apache.org</url>

	<parent>
		<groupId>org.springframework.boot</groupId>
		<artifactId>spring-boot-starter-parent</artifactId>
		<version>1.4.7.RELEASE</version>
		<relativePath /> <!-- lookup parent from repository -->
	</parent>

	<properties>
		<project.build.sourceEncoding>UTF-8</project.build.sourceEncoding>
	</properties>

	<dependencies>
		<!-- SpringBoot导入的jar包 -->
		<dependency>
			<groupId>org.springframework.boot</groupId>
			<artifactId>spring-boot-starter-web</artifactId>
		</dependency>
		 <!-- freemarker模版 -->
        <dependency>  
            <groupId>org.springframework.boot</groupId>  
            <artifactId>spring-boot-starter-freemarker</artifactId>  
        </dependency>
		<!-- jdbc -->
		<dependency>
			<groupId>org.springframework.boot</groupId>
			<artifactId>spring-boot-starter-jdbc</artifactId>
		</dependency>
		<!-- mybatis -->
        <dependency>
            <groupId>org.mybatis.spring.boot</groupId>
            <artifactId>mybatis-spring-boot-starter</artifactId>
            <version>1.3.0</version>
        </dependency>
		<!-- mysql -->
		<dependency>
			<groupId>mysql</groupId>
			<artifactId>mysql-connector-java</artifactId>
			<version>5.1.35</version>
		</dependency>
		<dependency>
			<groupId>com.alibaba</groupId>
			<artifactId>druid-spring-boot-starter</artifactId>
			<version>1.1.0</version>
		</dependency>
		<dependency>
			<groupId>junit</groupId>
			<artifactId>junit</artifactId>
			<version>3.8.1</version>
			<scope>test</scope>
		</dependency>
	</dependencies>
</project>

2、在com.etc.springboot2包下面新建一个SpringBootBaseApplication.java启动类:

package com.etc.springboot2;

import org.mybatis.spring.annotation.MapperScan;
import org.springframework.boot.SpringApplication;
import org.springframework.boot.autoconfigure.SpringBootApplication;
import org.springframework.context.annotation.ComponentScan;
/**
 * @Description:启动类,启动整个项目
 * @author zoey
 * @date:2018年3月7日
 */
@SpringBootApplication
@ComponentScan(basePackages="com.etc.*")//如果不写,默认扫描这个包下的所有类还有子包下的所有类
@MapperScan(value = "com.etc.mapper")//这样才能找到mapper文件
public class SpringBootBaseApplication {
	public static void main(String[] args) {
		SpringApplication.run(SpringBootBaseApplication.class, args);
		System.out.println("启动完成。。。。。。。。。。。");
	}
}

3、在数据库中新建一个表 t_user,添加一些简单的数据,如下:


4、新建src/main/resource源文件夹,在该文件夹下新建application.properties文件,配置一些参数如下:

###############################数据库配置###############################
spring.datasource.name=test
spring.datasource.url=jdbc:mysql://localhost:3306/test?characterEncoding=UTF-8
spring.datasource.username=root
spring.datasource.password=root
spring.datasource.type=com.alibaba.druid.pool.DruidDataSource
spring.datasource.driverClassName=com.mysql.jdbc.Driver

###########################mybatis配置###############################
#全局映射器启用缓存
mybatis.configuration.cache-enabled=true
#查询时,关闭关联对象及时加载以提高性能
mybatis.configuration.lazy-loading-enabled=false
#按需加载字段(加载字段由SQL指定),不会加载关联表的所有字段,以提高性能
mybatis.configuration.aggressive-lazy-loading=false
#允许返回不同的结果集以达到通用的效果
mybatis.configuration.multiple-result-sets-enabled=true
#对于批量更新操作缓存SQL以提高性能
mybatis.configuration.default-executor-type=REUSE
#数据库执行超时时间
mybatis.configuration.default-statement-timeout=25000
mybatis.mapper-locations=classpath:mapping/*.xml
mybatis.type-aliases-package=com.etc.vo
5、在com.etc.vo包下新建一个User.java类:
package com.etc.vo;
/**
 * @Description:用户实体类:包含用户的基本信息
 * 表中的字段:user_id、user_name、user_age、user_sex
 * @author zoey
 * @date:2018年3月7日
 */
public class User {
	private int userId;
	private String userName;
	private int userAge;
	private String userSex;
	public int getUserId() {
		return userId;
	}
	public void setUserId(int userId) {
		this.userId = userId;
	}
	public String getUserName() {
		return userName;
	}
	public void setUserName(String userName) {
		this.userName = userName;
	}
	public int getUserAge() {
		return userAge;
	}
	public void setUserAge(int userAge) {
		this.userAge = userAge;
	}
	public String getUserSex() {
		return userSex;
	}
	public void setUserSex(String userSex) {
		this.userSex = userSex;
	}
	public User(String userName, int userAge, String userSex) {
		super();
		this.userName = userName;
		this.userAge = userAge;
		this.userSex = userSex;
	}
	public User() {
		super();
	}
	@Override
	public String toString() {
		return "User [userId=" + userId + ", userName=" + userName + ", userAge=" + userAge + ", userSex=" + userSex
				+ "]";
	}
	
}

6、在src/main/resources下新建一个mapping文件夹,然后新建UserMapper.xml文件如下:

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE mapper PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN"   
"http://mybatis.org/dtd/mybatis-3-mapper.dtd"> 

<mapper namespace="com.etc.mapper.UserMapper">

	<!-- 结果集
		<result column="数据库字段名" property="实体类属性" jdbcType="数据库字段类型" />
	-->
	<resultMap type="com.etc.vo.User" id="userMap">
		<id column="user_id" property="userId"/>
		<result column="user_name" property="userName"/>
		<result column="user_age" property="userAge"/>
		<result column="user_sex" property="userSex"/>
	</resultMap>
	
	
	<!-- 查询用户的所有信息 -->
	<select id="findAll" resultMap="userMap">
		select
			user_id,
			user_name,
			user_age,
			user_sex
		from
			t_user
	</select>
	
	<!-- java.lang.IllegalArgumentException: Parameter Maps collection does not contain value for com.etc.mapper.UserMapper.userMap
	原因:将select中的resultMap写成了paramterMap
	-->
	
	<!-- 根据用户ID查询指定的用户信息 -->
	<select id="findById" resultMap="userMap" parameterType="java.lang.Integer">
		select 
			user_id,
			user_name,
			user_age,
			user_sex
		from 
			t_user
		where
			user_id = #{user_id}
	</select>
	
	<!-- 新增用户 -->
	<insert id="insertUser" parameterType="com.etc.vo.User"  useGeneratedKeys="true" keyProperty="userId">
		insert into
			t_user(user_name,user_age,user_sex)
		values
			(#{userName},#{userAge},#{userSex})
	</insert>
	<!--  There is no getter for property named 'user_name' in 'class com.etc.vo.User'
	原因:insert语句写错:
	<insert id="insertUser" parameterType="com.etc.vo.User"  useGeneratedKeys="true" keyProperty="user_id">
		insert into
			t_user(user_name,user_age,user_sex)
		values
			(#{user_name},#{user_age},#{user_sex})
	</insert>
	修改为:(#{}里面的需要填写类的属性,而不是表中的字段)
	<insert id="insertUser" parameterType="com.etc.vo.User"  useGeneratedKeys="true" keyProperty="userId">
		insert into
			t_user(user_name,user_age,user_sex)
		values
			(#{userName},#{userAge},#{userSex})
	</insert>
	 -->
</mapper>

7、在com.etc.mapper包下新建UserMapper.xml文件如下:

package com.etc.mapper;

import java.util.List;


import com.etc.vo.User;
/**
 * @Description:用户映射类,执行UserMapper.xml中的语句,方法名称与其中的id一致
 * @author zoey
 * @date:2018年3月7日
 */
public interface UserMapper {
	
	List<User> findAll();
	User findById(int userId);
	int insertUser(User user);
	
}

8、在com.etc.service包下新建UserService.java类如下:

package com.etc.service;

import java.util.List;

import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service;

import com.etc.mapper.UserMapper;
import com.etc.vo.User;

@Service(value="userService")
public class UserService {
	
	@Autowired 
	private UserMapper userMapper;
	
	
	public List<User> findAll() {
		return userMapper.findAll();
	}
	
	public User findById(int userId) {
		return userMapper.findById(userId);
	}

	public int insertUser(User user) {
		return userMapper.insertUser(user);
	}
}

9、在com.etc.controller包下新建UserController.java类如下:

package com.etc.controller;

import java.util.List;

import javax.servlet.http.HttpServletRequest;

import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.PathVariable;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestParam;
import org.springframework.web.bind.annotation.ResponseBody;

import com.etc.service.UserService;
import com.etc.vo.User;
/**
 * @Description:对用户进行增删查改操作
 * @author zoey
 * @date:2018年3月7日
 */
@Controller
@RequestMapping("/users")
public class UserController {
	@Autowired
	private UserService userService;
	/**
	 * @Description:查询用户的所有信息
	 * 访问地址:http://localhost:8080/users/findAll
	 * @param request 请求参数,保存查询到的用户信息,在前台(freemarker页面)直接获取
	 * @return 返回用户列表页面
	 * @author:zoey
	 * @date:2018年3月7日
	 */
	@RequestMapping("/findAll")
	public String findAll(HttpServletRequest request) {
		System.out.println("进入查询方法");
		List<User> userList = userService.findAll();
		for(User user:userList) {
			System.out.println("用户:"+user);
		}
		request.setAttribute("userList", userList);
		return "list";
	}
	/**
	 * @Description:根据用户ID查询用户信息
	 * 访问地址:http://localhost:8080/users/findById/1
	 * @param request
	 * @param id 使用url传递的参数
	 * @return 返回用户详细信息页面
	 * @author:zoey
	 * @date:2018年3月7日
	 */
	@RequestMapping("/findById/{id}")
	public String findById(HttpServletRequest request,@PathVariable("id") int id) {
		System.out.println("根据用户ID查询用户信息");
		User user = userService.findById(id);
		System.out.println("用户信息:"+user);
		request.setAttribute("user", user);
		return "details";
	}
	
	/**
	 * @Description:根据用户ID查询用户信息
	 * 访问地址:http://localhost:8080/users/findById2?user_id=1
	 * @param request
	 * @param id
	 * @return 返回用户详细信息页面
	 * @author:zoey
	 * @date:2018年3月7日
	 */
	@RequestMapping("/findById2")
	public String findById2(HttpServletRequest request,@RequestParam("userId") int userId) {
		System.out.println("根据用户ID查询用户信息");
		User user = userService.findById(userId);
		System.out.println("用户信息:"+user);
		request.setAttribute("user", user);
		return "details";
	}
	
	
	/**
	 * @Description:根据用户ID查询用户信息
	 * 访问地址:http://localhost:8080/users/findById/1
	 * @param request
	 * @param id
	 * @return 返回一个json对象(User的信息)
	 * @author:zoey
	 * @date:2018年3月7日
	 */
	@RequestMapping("/findById3/{id}")
	@ResponseBody
	public User findById3(HttpServletRequest request,@PathVariable("id") int id) {
		System.out.println("根据用户ID查询用户信息333333333");
		User user = userService.findById(id);
		System.out.println("用户信息:"+user);
		request.setAttribute("user", user);
		return user;
	}
	@RequestMapping("/insert")
	public String insert() {
		return "insert";
	}
	/**
	 * @Description:新增用户:在页面填写用户信息,然后进行添加
	 * @param request
	 * @param user 页面传递的用户信息(传递的参数是一个用户对象)
	 * @return 返回成功或者失败页面
	 * @author:zoey
	 * @date:2018年3月7日
	 */
	@RequestMapping("/insertUser")
	public String insertUser(HttpServletRequest request,User user) {
		System.out.println("新增用户");
		int result = userService.insertUser(user);
		if(result == 1) {
			System.out.println("新增用户成功!");
			request.setAttribute("userName", user.getUserName());
			return "success";
		}else {
			System.out.println("新增用户失败!");
			return "error";
		}
	}
	
	
}

10、在src/main/resources下面新建一个templates文件夹,新建list.ftl页面如下:

<!DOCTYPE html>
<html lang="zh-CN">
	<head>
		<meta charset="utf-8">
		<title>列表页面</title>
		<style>
			body{
				text-align:center;
			}
			p{
				font-size:24px;
				background-color:#ccc;
				text-align:center;
			}
			tr{
				width:400px;
				height:70px;
			}
			td{
				width:100px;
			}
		</style>
	</head>
	<body>
		<table border="1" cellspacing="0" cellpadding="0">
		<caption><h2>用户列表</h11></caption>
			<tr>
				<th>用户ID</th>
				<th>用户名</th>
				<th>年龄</th>
				<th>性别</th>
			</tr>
		<#list userList as item>
			<tr align="center">  
		    	<td>${item.userId}</td>  
		    	<td>${item.userName}</td>  
		    	<td>${item.userAge}</td>  
		    	<td>${item.userSex}</td>  
		    </tr> 
		</#list>
		</table>
	</body>
</html>

11、insert.ftl页面如下:

<!DOCTYPE html>
<html lang="zh-CN">
	<head>
		<meta charset="utf-8">
		<title>详情页面</title>
		<style>
			
		</style>
	</head>
	<body>
		<center>
		<h2>新增用户</h2>
		<form action="/users/insertUser" method="post">
			用户名:<input type="text" name="userName" value=""/><br/>
			年龄   :<input type="text" name="userAge" value=""/><br/>
			性别   :<input type="text" name="userSex" value=""/><br/><br/>
			<input type="submit" value="新增"/>
		</form>
		</center>
	</body>
</html>

12、details.ftl页面如下:

<!DOCTYPE html>
<html lang="zh-CN">
	<head>
		<meta charset="utf-8">
		<title>详情页面</title>
		<style>
			
		</style>
	</head>
	<body>
		<p>
			${user.userId}
			${user.userName}
			${user.userAge}
			${user.userSex}
		</p>
	</body>
</html>

13、success.ftl页面如下:

<!DOCTYPE html>
<html lang="zh-CN">
	<head>
		<meta charset="utf-8">
		<title>详情页面</title>
	</head>
	<body>
		<center>
		<p>
			欢迎${userName}!
		</p>
		</center>
	</body>
</html>

14、error.ftl页面如下:

<!DOCTYPE html>
<html lang="zh-CN">
	<head>
		<meta charset="utf-8">
		<title>详情页面</title>
	</head>
	<body>
		<center>
		<p>
			不好意思,报错了!
		</p>
		</center>
	</body>
</html>

14、项目结构图如下:


查看全部信息:

       访问方式:http://localhost:8080/users/findAll,页面效果如下:


查看详情:

            访问方式:http://localhost:8080/users/findById/1,返回User对象,页面效果如下:


查看详情:

      访问方式:http://localhost:8080/users/findById2?user_id=2,返回User对象,页面效果如下:


查看详情:

   访问方式:http://localhost:8080/users/findById3?user_id=3,返回json数据,页面效果如下:


新增用户:

      访问方式:http://localhost:8080/users/insert,页面效果如下:


返回成功页面:




猜你喜欢

转载自blog.csdn.net/zz2713634772/article/details/79471710