首页>>后端>>SpringBoot->springboot前端页面放哪?

springboot前端页面放哪?

时间:2023-12-05 本站 点击:0

Spring Boot 中 Controller 返回HTML页面

由于Spring Boot 内嵌了 Tomcat 容器,所以不用把项目打亩雀成war包,再放到Tomcat中去运行。但是随之出现了个问题,基于Tomcat的Web应用都有一个 /团耐槐webapp 目录来存放前端页面和静态资源等文件。那么Spring Boot中应该放在哪里呢?

如果你是用Spring Initializr新建的项目的话,那么当你打开项目,就会看到:

对, /resources 目录下已经存在了两个包:

/static 用来存放静态文件

/templates 用来存放前端页面

Ps:没有目录的话可以自己创建

我们写一个最简单的HTML页面,放在 /templates 下:

可能你注意到了,在 html lang="zh-CN" xmlns:th="" 中多了点东西,没关系,继续往下看。

我们写一个Spring MVC中最简单的Controller,用来返回hello.html:

然后通过Postman来测试一下接口:

可以看到报错了,错误提示说,可能是没有指定视图。

我们知道在传统的Tomcat Web应用里面,还需要配置web.xml与SpringMVC。

不过也太麻烦啦,所以Spring Boot就简化了这些配置,并且推荐使用Thymeleaf前端塌友模板引擎。

前面提到的多了点东西也就是这个引擎的语法。

我用Gradle做依赖管理:

可以看到返回的就是hello.html

Thymeleaf语法也是个坑,有时间再去看看吧~

SpringBoot页面展示Thymeleaf

开发传统Java WEB工程时,我销颂穗们可以使用JSP页面模板语言,但是在SpringBoot中已经不推荐使用了。SpringBoot支持如下页面模板语言

上面并没有列举所有SpringBoot支持的页面模板技术。其中Thymeleaf是SpringBoot官方所推荐使用的,下面来谈谈Thymeleaf一些常用的语法规则。

要想使用Thhymeleaf,首先要在pom.xml文件中单独添加Thymeleaf依赖。

Spring Boot默认存放模板页面的路径在 src/main/resources/templates 或者 src/main/view/templates ,这个无论是使用什么模板语言都一样,当然默认路径是可以自定义的,不过一般不推荐这样做。另外Thymeleaf默认的页面文件后缀是 .html 。

在MVC的开发过程中,我们经常需要通过 Controller 将数据传递到页面中,让页面进行动态展示。

创建一个Controller对象,在其中进行参数的传递

在SpringBoot默认的页面路径下创建show.html文件,内容如下

可以看到在 p 标签中有 th:text 属性,这个就是thymeleaf的语法,它表示显示一个普通的文本信息。

如果我们要显示的信息是存在资源文件中的,同样可以在页面中显示,例如资源文件中定义了内容 welcome.msg=欢迎{0}光临! 。可以在页面中将其显示

另外,在 th:utext 中还能做一些基础的数学运算

如果我们想要传递到的页面的信息,它本身是带有CSS样式的,这个时候如何在页面中将携带的样式信息也显示出来?此时我们的控制器方法这样写。

此时页面中需要借助 th:utext 属性进行显示

通过浏览器查看页面源码可以看出 th:utext 和 th:text 的区别是: th:text 会对 和 进行转义,而 th:utext 不会转义。

我们常常需要将一个bean信息展示在前端页面当中。

上面给出了两种展现方式,一种是通过${属性},另外一种是通过 {属性}。

关于“${属性}”和“ {属性}”的区别?

$访问完整信息,而访问指定对象中的属性内容, 如果访问的只是普通的内容两者没有区别;

在 thymeleaf 之中提供有相应的集合的处理方法,例如:在使用 List 集合的时候可以考虑采用 get()方法获取指定索引的数据,那么在使用 Set 集合的时候会考虑使用 contains()来判断某个数据是否存在,使用 Map 集合的时候也希望可以使用 containsKey()判断某个 key 是否存在,以及使用get()根据 key 获取对应的 value,而这些功能在之前并不具备,下面来观察如何在页面中使用此类操作

在传统WEB工程开发时,路径的处理操作是有点麻烦的。SpringBoot中为我们简化了路径的处理。

页面之间的跳转也能通过@{}来实现

虽然在这种模版开发框架里面是不提倡使用内置对象的,但是很多情况下依然需要使用内置对象进行处理,所以下面来看下如何在页面中使用JSP内置对象。

thymeleaf 考虑到了实际的开发情况,因为 request 传递属性是最为常用的,亏卜但是 session 也有可能使用,例如:用户登录之后需要显示用户 id,那么就一定要使用到 session,所以现在必须增加属性范围的形式后才能够正常使用。樱告在 thymeleaf 里面也支持有 JSP 内置对象的获取操作,不过一般很少这样使用。

所有的页面模版都存在各种基础逻辑处理,例如:判断、循环处理操作。在 Thymeleaf 之中对于逻辑可以使用如下的一些运算符来完成,例如:and、or、关系比较(、、=、=、==、!=、lt、gt、le、ge、eq、ne)。

通过控制器传递一些属性内容到页面之中:

不满足条件的判断

通过swith进行分支判断

在实际开发过程中常常需要对数据进行遍历展示,一般会将数据封装成list或map传递到页面进行遍历操作。

我们常常需要在一个页面当中引入另一个页面,例如,公用的导航栏以及页脚页面。thymeleaf中提供了两种方式进行页面引入。

可以看到页面当中还存在一个变量projectName,这个变量的值可以在引入页面中通过 th:with="projectName=百度" 传过来。

如何将网上下载的前端页面放到自己的项目中?

网上你下载之后的前端,只是一个表面,还需要做接州拦激口跟后台进行对接,才可以获取到自己衡余的数据,要是你只展示一个前册袜端,那直接传到服务器上就可以展示了,页面用html展示就行


本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。
如若转载,请注明出处:/SpringBoot/12727.html