springboot的Web开发进阶

Posted zpKang

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了springboot的Web开发进阶相关的知识,希望对你有一定的参考价值。

springboot的Web开发

web开发我们需要导入的两个依赖有: thymeleafSpring Web

<dependency>
    <groupId>org.springframework.boot</groupId>
    <artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>
<dependency>
    <groupId>org.springframework.boot</groupId>
    <artifactId>spring-boot-starter-web</artifactId>
</dependency>
<!--数据库等依赖: 略-->

服务器配置

服务器配置也就是配置我们的servlet

例如: 修改端口号 , 默认的端口号是8080

server.port=8888

配置上下文路径

springboot服务器启动后, 默认的路径是localhost:8080/

我们可以这样配置:

server.servlet.context-path=/MyWeb

这样我们的默认路径就是 localhost:8080/MyWeb/

默认视图跳转

thymeleaf文档[跳转]

thymeleaf模板引擎的默认资源路径是classpath:/templates/resource/templates/

当然我们也可以手动进行配置, 如下:

# 配置前缀, 默认是`classpath:/templates
spring.thymeleaf.prefix=classpath:/templates/pages/
# 配置后缀
spring.thymeleaf.suffix=.html

这样我们配置好了视图的跳转

例如我们有个controller, controller中有如下方法

@Controller
@RequestMapping("/goods")
public class GoodsController {
    @RequestMapping("/doGoodsUI") 
    public String doGoodsUI(Model model) {
        // 1. 将此view返回给前端控制器
        // 2. 前端控制器会调用师徒解析器对view进行解析, 添加前缀和后缀
        // /templates/pages/goods.html
        // 3. 最后由DespatcherServlert将页面相应到客户端
        return "goods"; // view name
    }
}

那么我们访问:localhost:8080/goods/doGoodsUI 就会跳转到 resource/templates/pages/goods.html

视图展示数据(thymeleaf)

thymeleaf文档[跳转]

视图展示数据我们依然可以使用ModelMap后者Model把数据传到前端页面

例如: 查询所有的商品

@RequestMapping("/doGoodsUI") 

	@Autowired
	private GoodsService goodsService;

	public String doGoodsUI(Model model) {
		// 假设goodsService中的findObjects()方法是查询到的所有商品, 我们把它传入model对象中
        // model会把数据发送到前端页面
		model.addAttribute("list", goodsService.findObjects());
		return "goods"; 
	}

现在我们在resource/templates/pages/下创建一个html: goods.html

我已经配置了 spring.thymeleaf.prefix=classpath:/templates/pages/, 所以我把html文件放到了resource/templates/pages/下, 在创建前请确定你配置的路径

我们需要添加xml命名空间, 新版本加不加都无所谓, 老版本可能无法使用th开头的标签属性

<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Insert title here</title>
</head>
<body>
    
</body>

这样就创建好了, 我们需要在body中写入内容

<table>
    <thead>
        <tr>
            <th>id</th>
            <th>name</th>
            <th>remark</th>
            <th>createdTime</th>
        </tr>
    </thead>
    <tbody>
        <!-- 我们需要遍历controller传过来的集合 -->
    	<tr th:each="g : ${list}">
            <td th:text="${g.id}">1</td>
            <td th:text="${g.name}">mysql</td>
            <td th:text="${g.remark}">oranges</td>
            <!--thymeleaf日期格式化功能-->
            <td th:text="${#calendars.format(g.createdTime, ‘yyyy-MM-dd HH:mm‘)}">2020-01-01</td>
        </tr>
    </tbody>
</table>

进行测试测试

浏览器输入:localhost:8080/goods/doGoodsUI

可以看到数据库中的数据已经显示到了表格中

以上是关于springboot的Web开发进阶的主要内容,如果未能解决你的问题,请参考以下文章

我的Android进阶之旅NDK开发之在C++代码中使用Android Log打印日志,打印出C++的函数耗时以及代码片段耗时详情

springboot-web进阶——统一异常处理

springboot Thymeleaf 整合

Spring Boot学习进阶笔记-初体验,创建基本的web功能

springboot-web进阶——单元测试

高效Web开发的10个jQuery代码片段