利用Springboot和网络上的网页模板搭建个赶时间的网站（项目需要没办法）

最新推荐文章于 2022-09-22 14:29:40 发布

zihao_cui

最新推荐文章于 2022-09-22 14:29:40 发布

阅读量873

点赞数 1

分类专栏： SpringBoot

本文链接：https://blog.csdn.net/qq_32691667/article/details/104897060

版权

SpringBoot 专栏收录该内容

12 篇文章 0 订阅

订阅专栏

找到你中意的模板

我这里下载下来后的文件结构如下图
在这里插入图片描述

新建一个Springboot项目

在这里插入图片描述
注意这里没有引用Thymeleaf
找到下面的static

把下载的网页模板赋值到static文件夹里面

在这里插入图片描述
运行springBoot项目后，根据你模板的主页是那个html文件访问就好了，比如本次演示的是
就是访问下面的网址

我们如此方便就能跑起来，主要是因为我们SpringBoot的静态资源都能让页面请求到，这里不仅仅是html文件，还包括css js 图片等其他静态资源。

网页中关于静态资源的请求如下：
在这里插入图片描述

SpringBoot中关于如何寻找静态资源的配置是 spring.mvc.static-path-pattern

这个配置项是告诉springboot，应该以什么样的方式去寻找资源。默认配置为 /* 。换句话说，只有静态资源满足什么样的匹配条件，Spring Boot才会处理静态资源请求
但是你会发现这样的网页其实就是一个html文件，我们平常访问网页其实是一个请求，后端解析后给我们返回相应html文件，那么我们需要一个控制类
在这里插入图片描述
另外最开始放在静态static文件夹的html文件应该放入template文件夹

此时再直接访问html文件就没用了

而访问我们再控制类加入的路径就好了

但这里会有个问题，就是网页跳转的时候，比如index.html里面的a标签，你再点击时候就会出现
在这里插入图片描述

原因就是这个标签直接请求了一个静态html文件，但是我们在static里面已经不存在这些html了，那么为了响应这个请求，我们可以改一改网页的标签

改为

 <li><a href='/single'><span>About</span></a></li>

这样我们打开网页上面的About标签，请求就是http://localhost:8080/single
了，之后在控制类里面添加新的映射就好了

@RequestMapping("/single")
	public String getSingle(Model model)  {
		
		return "single";
	}

如果我们需要对网页加入一些动态的数据，可以直接使用Thymeleaf模板

只需要在pom.xml加上依赖

<dependency>
			<groupId>org.springframework.boot</groupId>
			<artifactId>spring-boot-starter-thymeleaf</artifactId>
		</dependency>

然后再每个html文件里面加上的html标签加上

<html lang="en"  xmlns:th="https://www.thymeleaf.org">

我这里是改了改网页标题
在这里插入图片描述
代码如下

<title th:text="${Myown}">zTopModel - Free Responsive Html5 Templates</title>

控制类变为
在这里插入图片描述
主要代码如下

@RequestMapping("/")
	public String getIndex(Model model)  {
		model.addAttribute("Myown","我们自己的数据");
		return "index";
	}

在这里插入图片描述

OK了吧，还算简单了

zihao_cui

关注

1
点赞
踩
4

收藏

觉得还不错? 一键收藏
0
评论
利用Springboot和网络上的网页模板搭建个赶时间的网站（项目需要没办法）

找到你中意的模板我这里下载下来后的文件结构如下图新建一个Springboot项目注意这里没有引用Thymeleaf找到下面的static把下载的网页模板赋值到static文件夹里面运行springBoot项目后，根据你模板的主页是那个html文件访问就好了，比如本次演示的是就是访问下面的网址我们如此方便就能跑起来，主要是因为我们SpringBoot的静态资源都能让页面请...
复制链接

扫一扫