学习笔记-Spring Boot-web开发使用FreeMarker模板

本文通过一个用户登录、注册和查看用户列表的示例,介绍如何在Spring Boot项目中结合FreeMarker模板进行Web开发。文章涵盖项目结构、依赖配置、FreeMarker模板编写、数据库交互以及代码实现,包括domain、controller、service、repository各层的详细说明。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

Spring Boot 提供了spring-boot-starter-web来为Web开发予以支持,spring-boot-starter-web为我们提供了嵌入的Tomcat以及SpringMVC的依赖,用起来很方便。
本篇将采用Freemarker模板来做一个用户登录、注册以及查看用户列表的功能(不包含权限控制),来展示简单的Spring Boot 的web开发,数据库访问等等。

一、项目结构:

项目为Spring Boot 典型项目结构,分为 domain、controller、service、repository,资源直接使用模板放在templates目录。

二、添加项目依赖

在pom.xml添加对FreeMarker、数据库访问的依赖

        <!-- spring-data-jpa -->
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-data-jpa</artifactId>
        </dependency>
        
        <!-- mysql驱动 -->
        <dependency>
            <groupId>mysql</groupId>
            <artifactId>mysql-connector-java</artifactId>
        </dependency>

        <!-- 使用Freemarker替代JSP做页面渲染 -->
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-freemarker</artifactId>
        </dependency>

在application.properties中设置数据库连接参数:

spring.datasource.url=jdbc:mysql://localhost:3306/test // 数据库连接
spring.datasource.username=root // 你自己的数据库用户名
spring.datasource.password=root // 你自己的数据库密码
spring.datasource.driver-class-name=com.mysql.jdbc.Driver
spring.jpa.properties.hibernate.hbm2ddl.auto=update

三、编写FreeMarker模板文件

1、编写登录模板login.ftl,放在资源的templates目录下:

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>登陆</title>
</head>
<body>
    <form action="/user/ulogin" method="post">
        <input type="text" name="username" /></br>
        <input type="password" name="password" /></br>
        <input type="submit" value="登陆" /></br>
    </form>
    <form action="/user/register", method="post">
    	<input type = "submit" value="注册"/></br>
    </form>
</body>
</html>

2、编写主页index.ftl,放在资源的templates目录下,登录成功后会进入此页面:

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>登陆成功</title>
</head>
<body>
欢迎您${userLogin.name }
<form action="/user/list" method="get">
    <input type="submit" name="" id="" value="查看列表" /></br>
</form>
</body>
</html>

3、编写register.ftl,注册页面,放在资源的templates目录下,登录页面可以进入此页面:

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>注册</title>
</head>
<body>
    <form action="/user/uregister" method="post">
        用户名:<input type="text" name="username" /></br>
        密码:<input type="password" name="password" /></br>
        确认密码:<input type="password" name="password2" /></br>
        <input type="submit" value="注册">
    </form>
</body>
</html>

4、编写list.ftl,放在资源的templates/user/ 目录下,在首页页面查看可以进入此页面:

<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <title>用户列表</title>
    <link href="/css/main.css" rel="stylesheet" />
</head>
<body>
    <table>
        <thead>
            <tr>
                <th>ID</th>
                <th>姓名</th>
                <th>生日</th>
                <th>薪资</th>
            </tr>
        </thead>
        <tbody>
            <#list userList as user>
            <tr>
                <td>${user.id}</td>
                <td>${user.name}</td>
                <td>${user.birthday?string('yyyy-MM-dd')}</td>
                <td>${user.salary}</td>
            </tr>
            </#list>
        </tbody>
    </table>
</body>
</html>

四、建立数据库

1、在mysql中创建test库,并建立t_user表,SQL语句如下:

CREATE TABLE `t_user` (
  `id` int(11) NOT NULL AUTO_INCREMENT,
  `birthday` datetime DEFAULT NULL,
  `name` varchar(255) DEFAULT NULL,
  `salary` decimal(19,2) DEFAULT NULL,
  `password` varchar(16) DEFAULT '123456',
  PRIMARY KEY (`id`)
) ENGINE=MyISAM AUTO_INCREMENT=4 DEFAULT CHARSET=utf8

五、代码编写

1、编写domain层代码,User.java:

package com.example.demo.domain;

import javax.persistence.*;
import java.io.Serializable;
import java.math.BigDecimal;
import java.util.Date;

@SuppressWarnings("serial")
@Entity
@Table(name="t_user")
public class User implements Serializable {

    @Id
    @GeneratedValue(strategy = GenerationType.AUTO)
    private int id;
    private String name;
    private Date birthday;
    private BigDecimal salary;
    private String password;

    public User(){}
    
    public User(int id, String name, String password) {
        this.id = id;
        this.name = name;
        this.birthday = new Date();
        this.salary = BigDecimal.valueOf(0.0);
        this.password = password;
    }

    public User(int id, String name, Date birthday, BigDecimal salary) {
        this.id = id;
        this.name = name;
        this.birthday = birthday;
        this.salary = salary;
        this.setPassword("123456");
    }

    public int getId() {
        return id;
    }

    public void setId(int id) {
        this.id = id;
    }

    public String getName() {
        return name;
    }

    public void setName(String name) {
        this.name = name;
    }

    public Date getBirthday() {
        return birthday;
    }

    public void setBirthday(Date birthday) {
        this.birthday = birthday;
    }

    public BigDecimal getSalary() {
        return salary;
    }

    public void setSalary(BigDecimal salary) {
        this.salary = salary;
    }

	public String getPassword() {
		return password;
	}

	public void setPassword(String password) {
		this.password = password;
	}
}

2、编写数据访问层repository, UserRepository.java:

package com.example.demo.repository;

import org.springframework.data.jpa.repository.JpaRepository;
import org.springframework.data.jpa.repository.Query;
import org.springframework.data.repository.query.Param;

import com.example.demo.domain.User;

public interface UserRepository extends JpaRepository<User, Integer> {
	
	public User findByName(String name);

	public User findByNameAndPassword(String name, String password);

	@Query("from User u where u.name=:name")
	public User findUser(@Param("name") String name);
	
	@Query("select max(id) from User")
	public int getMaxId();

}

3、编写service层,包含接口和实现:

接口 UserService.java:

package com.example.demo.service;

import java.util.List;

import com.example.demo.domain.User;

public interface UserService {

	/**
	 * 获取用户信息列表
	 * @return 返回已有用户列表
	 */
    List<User> getUserList();
    
    User findByName(String name);

	User findByNameAndPassword(String name, String password);

	User findUser(String name);
	
	/**
	 * 获取下一个ID
	 * @return 
	 */
	int getNextId();
    
    /**
     * 校验用户
     * 
     * @param name 用户名
     * @param password 密码
     * @return
     */
    boolean authUser(String name, String password);
    
    /**
     * 注册用户
     * 
     * @param user 待注册用户信息
     * @return
     */
    String registerUser(User user);
}

实现 UserServiceImpl.java:

package com.example.demo.service;

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

import com.example.demo.domain.User;
import com.example.demo.repository.UserRepository;

import java.util.List;

@Service
public class UserServiceImpl implements UserService {

    @Autowired
    UserRepository userRepository;

    @Override
    public List<User> getUserList() {
        return userRepository.findAll();
    }
    
    @Override
    public User findByName(String name){
    	return userRepository.findByName(name);
    }

    @Override
    public User findByNameAndPassword(String name, String password) {
    	return userRepository.findByNameAndPassword(name,  password);
    }

    @Override
    public User findUser(String name) {
    	return userRepository.findUser(name);
    }
    
    @Override
    public int getNextId() {
    	return userRepository.getMaxId() + 1;
    }
    
    @Override
    public boolean authUser(String name, String password) {

        if (userRepository.findByNameAndPassword(name, password).getName().isEmpty()) {
            return false;
        } else {
            return true;
        }

    }

    @Override
    public String registerUser(User user) {
    	User existUser = userRepository.findByName(user.getName());
        if (existUser == null || existUser.getName().isEmpty()) {
            userRepository.save(user);
            return "用户名  " + user.getName() + " 注册成功";

        } else {

            return "用户名 " + user.getName() + "已被占用!";
        }

    }
}

4、编写controller层,UserController.java:

package com.example.demo.controller;

import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpSession;

import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.servlet.ModelAndView;

import com.example.demo.domain.User;
import com.example.demo.service.UserService;

@Controller
@RequestMapping("/user/*")
public class UserController {

	@Autowired
	UserService userService;

	User user;

	@RequestMapping("/list")
	public ModelAndView userList() throws Exception {
		ModelAndView mv = new ModelAndView();
		mv.addObject("userList", userService.getUserList());
		mv.setViewName("/user/list");

		return mv;
	}

	@RequestMapping("/index")
	public String index(HttpSession httpSession) {
		httpSession.getAttribute("userLogin");
		return "index";
	}

	@RequestMapping("/register")
	public String register() {
		return "register";
	}

	@RequestMapping("/login")
	public String login() {
		String str = "";
		if (user != null) {
			str = "index";
		} else {
			str = "login";
		}
		return str;
	}

	@RequestMapping("/uregister")
	public String register(HttpServletRequest request) {
		String username = request.getParameter("username");
		String password = request.getParameter("password");
		String password2 = request.getParameter("password2");
		String str = "";
		if (password.equals(password2)) {
			user = userService.findByName(username);
			if (user == null) {
				/**
				 * sql 自增字段设置,使用数据库中最大id+1来表示
				 * 此处在实际项目中需要支持自动增量,不能这样写的。
				 */
				user = new User(userService.getNextId(), username, password);
				userService.registerUser(user);
				str = "login";
			} else {
				str = "register";
			}
		} else {
			str = "register";
		}
		return str;
	}

	@RequestMapping("/ulogin")
	public String login(HttpServletRequest request, HttpSession session) {
		String username = request.getParameter("username");
		String password = request.getParameter("password");
		user = userService.findByNameAndPassword(username, password);
		String str = "";
		if (user != null) {
			session.setAttribute("userLogin", user);
			str = "index";
		} else {
			str = "login";
		}
		return str;
	}

}

上述几个类编写完成,整体项目也就完成了,接下来就是简单的运行了。

六、运行项目

1、启动项目成功后,可以通过 http://localhost:8080/user/login 直接访问登录页面,页面如下:

2、登录成功后,进入首页页面:

3、在首页点击查看列表,可以进入列表信息页面:

4、在登录页面,点击“注册”,进入注册页面:

 

七、说明

此项目仅仅是一个展示类项目,做为学习途中一个里程碑,更加深入的探究,需要后续大量实践来完成。

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值