| |
|
开发:
C++知识库
Java知识库
JavaScript
Python
PHP知识库
人工智能
区块链
大数据
移动开发
嵌入式
开发工具
数据结构与算法
开发测试
游戏开发
网络协议
系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程 数码: 电脑 笔记本 显卡 显示器 固态硬盘 硬盘 耳机 手机 iphone vivo oppo 小米 华为 单反 装机 图拉丁 |
-> Java知识库 -> 27年,我送你个静态资源导入不过分吧? -> 正文阅读 |
|
[Java知识库]27年,我送你个静态资源导入不过分吧? |
SpringBootWeb开发回顾一下: springboot帮助我们配置了什么,能不能进行修改,能修改哪些,能否扩展?
开发要解决的问题:
1. 静态资源导入先创建一个普通的springboot项目,主需要加入web即可。 我们在进行项目之前首先要确保环境正确,我们先用helloController测试一下。如果能跳转成功则进行接下来的步骤
静态资源的映射规则: springmvc的web配置都在WebMvcAutoConfiguration 这个配置类里面;进去查看我们发现有一个添加资源处理的方法
快速搜索内容:双击Shift键,框中直接搜你想搜的类或者方法。 第一种:使用原本的,也就是第一个if 在里面我们可以看到所有的 webjarsWebjars本质就是以jar包的方式引入我们的静态资源 , 我们以前要导入一个静态资源文件,直接导入即可。 使用SpringBoot需要使用Webjars,我们可以去搜索一下: 网站: 要使用jQuery,我们只要要引入jQuery对应版本的pom依赖即可!
导入完毕之后我们可以查看webjars的目录结构,并且此时可以访问jquery.js文件了。 导入完成后我们进行查看,运行之后输入链接 使用自己的静态资源上述是第一种if,那么没找到怎么办呢,就出现了下面的情况
我们去查看staticPathPattern发现第二种映射规则 : 发现里面的有对应的四个位置。ResourceProperties 可以设置和我们静态资源有关的参数;这里面指向了它会去寻找资源的文件夹。
在这四个目录下的静态资源同样可以被我们识别到 但是会有优先级,resources优先级最高,static其次,public最低 总结
2.制作特殊的首页我们什么都不管的时候,访问"localhost:8080"会是默认的页面 而原理也就在下方这个代码中 我们让首页进行改变。需要添加一个静态资源,让首页换一个样子 增加一个界面,重新运行 成功后的结果 这样就是实现了首页界面的定制 欢迎页,静态资源文件夹下的所有 index.html 页面;被 /** 映射。 比如我访问 新建一个 index.html ,在我们上面的3个目录中任意一个;然后访问测试 图标转变这个在新的版本代码已经变成了下图的样子 之前是可以在springboot的配置静态内容位置中找到
然后可以自己换一个图标放在public目录下,清楚缓存,刷新网页就可以了。 Thymeleaf模板引擎模板引擎的作用就是我们来写一个页面模板,比如有些值呢,是动态的,我们写一些表达式。而这些值,从哪来呢,就是我们在后台封装一些数据。然后把这个模板和这个数据交给我们模板引擎,模板引擎按照我们这个数据帮你把这表达式解析、填充到我们指定的位置,然后把这个数据最终生成一个我们想要的内容给我们写出去,这就是我们这个模板引擎 如果我们没有模板引擎的话,在页面中会提示500 引入Thymeleaf在项目中加入依赖
Thymeleaf 官网:https://www.thymeleaf.org/ Thymeleaf 在Github 的主页:https://github.com/thymeleaf/thymeleaf Spring官方文档:找到我们对应的版本 https://docs.spring.io/spring-boot/docs/2.3.7.RELEASE/reference/htmlsingle/#using-boot-starter 我们可以有通过上述的页面找到我们需要的依赖,进而复制粘贴即可。 引入之后我们再次运行。nice 注意: 使用Thymeleaf,只需要导入对应的依赖即可。同时我们的html页面试放在我们的templates目录下的。 至于为什么,我们看源码,这段源码在
取值那么我们应该怎么取值呢 首先在controller下编写代码
接下来我们在html页面中编写 因为我们要使用thymeleaf,需要在html文件中导入命名空间的约束。
成功运行后 这里需要这个的th标签。所有的html元素都科一被thymeleaf替换接管,格式为 有无转义从controller传一段信息
html中使用转义和不转义的情况
运行结果 循环同样在controller里传一段信息
接下来在html中进行取值
运行结果 |
|
|
上一篇文章 下一篇文章 查看所有文章 |
|
开发:
C++知识库
Java知识库
JavaScript
Python
PHP知识库
人工智能
区块链
大数据
移动开发
嵌入式
开发工具
数据结构与算法
开发测试
游戏开发
网络协议
系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程 数码: 电脑 笔记本 显卡 显示器 固态硬盘 硬盘 耳机 手机 iphone vivo oppo 小米 华为 单反 装机 图拉丁 |
360图书馆 购物 三丰科技 阅读网 日历 万年历 2024年11日历 | -2024/11/23 20:09:45- |
|
网站联系: qq:121756557 email:121756557@qq.com IT数码 |