springboot +thymeleaf 实现本地图片显示，和数据库查询显示

最新推荐文章于 2024-04-18 15:44:19 发布
置顶 最新推荐文章于 2024-04-18 15:44:19 发布
阅读量7.1k 收藏 13
点赞数 10
分类专栏： springboot thymeleaf 文章标签： java
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_47338687/article/details/107045739
版权

在页面显示静态资源，在程序中非常常见，当然也有很多种方式例如保存在resources/META-INF目录下或直接引用本地路径等。

1、了解springboot的静态资源的地址与访问路径

springboot自己是有默认的静态访问资源地址和路径（默认寻找static目录），如果你在配置文件中修改
则会覆盖其默认配置。
那先来了解一下在配置文件中想更改默认地址的代码：

spring.mvc.static-path-pattern

这句话的意思的你应该以什么路径来访问静态资源，也可以说静态资源满足这个配置路径才会处理此请求。

#这种情况下只有请求路径满足img格式才可以处理此请求
#如果按照默认的8080端口的话那么路径就应该为localhost:8080/img/1.jpg
#此时我们想找寻1.jpg的图片,那么springboot就会默认在该路径下寻找对应的文件，
#而寻找对应文件的地址就应该由spring.resources.static-locations里决定
spring.mvc.static-path-pattern=/img/**

spring.resources.static-locations

这行代码配置用来告诉springboot应该去什么路径下访问并寻找相应的文件

默认的官方配置

pring.resources.static-locations=classpath:/static,classpath:/public,classpath:/resources,classpath:/META-INF/resources
这里的匹配机制是列表性的会依次寻找相应目录是否有对应的文件
但是大家也都发现了，这些是项目里自带的资源目录如果我又想访问本地
路径的资源呐？

引用本地路径资源

spring.resources.static-locations=file:F:/images/rotPhoto/
这里我们引用的是F盘的路径，想要成功引用只需要在路径前面加上file即可，
不过根据网上资料显示，不同操作系统之间file的写法好像并不相同，这里演示的>Windows的写法。
当然你如果觉得这样不好的话，也可以通过bean的方式来修改，这样的话需要你创建个extends WebMvcConfigurerAdapter 的类，类重写里面的addResourceHandlers方法来进行修改。
通过查阅资料，也可以通过xml的格式来进行修改代码如下：

<mvc:resources mapping="/resources/**" location="/public-resources/">
    <mvc:cache-control max-age="3600" cache-public="true"/>
</mvc:resources>
总结：spring.mvc.static-path-pattern 更像是指定http请求访问的地址规范，spring.resources.static-locations则是请求之后访问文件的路径!

2、结合springboot，thymeleaf 来简单的实现访问本地路径图片到浏览器上！

博主使用工具为sts，maven，boot版本都为截稿前官网最新（2020.6.30）

  1. 创建项目

     1.修改静态资源的地址和访问路径的配置文件

代码如下:spring.resources.static-locations=file:F:/images/rotPhoto/
		spring.mvc.static-path-pattern=/**
博主使用的是自己F盘路径下的images文件夹里的rotPhoto文件夹下的目录
这里出示的为properties配置文件的代码。

      2.创建controller页面
	  3.创建thymeleaf页面

需要的thymeleaf页面配置代码:<html xmlns:th="http://www.thymeleaf.org" lang="en">

  1. 添加代码
    1.博主创建的thymeleaf页面叫Demo
    控制controller代码如下：
	@RequestMapping("/Demo")
	public String demo(Model model){
		String img2 ="/1.jpg";
		model.addAttribute("img2", img2);
		return "Demo";
	}

博主相应目录有一个jpg格式的图片名1，这里定义一个文件名的字符串
用model向前端页面传值
Demo页面代码如下：

<img th:src="@{${img2}}">

用${img2} 来接受后台传入的数据，这里用到了th:src
  1. 运行
    1.启动@SpringBootApplication类
    在这里插入图片描述
    运行成功之后，去浏览器输入请求
    在这里插入图片描述
    自此显示成功
    补：文件路径图片
    在这里插入图片描述
    连接数据库这几天补上~~~~~~ O(∩_∩)O哈哈~
    2020-7-07：
    比较忙，一直没时间，不要慌再等等O(∩_∩)O 2020 - 7-10
本文理论方面参考博客：https://blog.csdn.net/yiifaa/article/details/78299052?utm_medium=distribute.pc_relevant_t0.none-task-blog-BlogCommendFromMachineLearnPai2-1.nonecase&depth_1-utm_source=distribute.pc_relevant_t0.none-task-blog-BlogCommendFromMachineLearnPai2-1.nonecase

大家如果觉得博主表达的不好，推荐大家去看原博主

夏弥(●—●)
关注
  • 10
    点赞
  • 踩
  • 13
    收藏
    觉得还不错? 一键收藏
  • 15
    评论
专栏目录
HTML img 中的 src 访问不到绝对路径下的图片怎么办?
qq_41424688的博客
10-10 3万+
HTML访问不到绝对路径下的图片怎么办?        有时候我们使用 img 标签下的src属性访问图片的时候,会想把图片放到D盘或者E盘的某个路径。但是结果却是访问不到。一开F12调试却看到了绝对路径前面多了 file:///。就是下图这个样子。但是当我们用浏览器访问却可以访问得到。这怎么解决呢?        其实只要把目录拦截住然后映射到D盘或者E盘就好了。如
springboot+tyhmeleaf显示图片的三种方法
dzydzy7的博客
04-04 2354
方法一：直接使用本地文件 这种方法的原理是把本地文件夹映射为服务器地址， 我们可以使用配置类来实现： package com.dzy.config; import com.dzy.utils.RootFolderUtils; import org.springframework.beans.factory.annotation.Autowired; import org.springframew...
Spring Boot如何实现在线预览？这个开源项目可以学习一下，支持99%常用文件！
最新发布
2401_84412411的博客
04-18 626
互联网大厂比较喜欢的人才特点：对技术有热情，强硬的技术基础实力；主动，善于团队协作，善于总结思考。无论是哪家公司，都很重视高并发高可用技术，重视基础，所以千万别小看任何知识。面试是一个双向选择的过程，不要抱着畏惧的心态去面试，不利于自己的发挥。同时看中的应该不止薪资，还要看你是不是真的喜欢这家公司，是不是能真的得到锻炼。其实我写了这么多，只是我自己的总结，并不一定适用于所有人，相信经过一些面试，大家都会有这些感触。下面有部分截图希望能对大家有所帮助。
SpringBoot、Thymeleaf访问本地路径图片
weixin_46687797的博客
05-12 1585
图片路径访问
SpringBoot + thymeleaf + mysql 实现读取图片并显示
CJW的博客
04-13 6028
SpringBoot通过数据库读取图片并显示 业务场景及实现思路：设置图片静态存储路径，通过多级动态联动下拉框实现图片显示及翻页查看。页面渲染前通过数据库选择查询动态获取下拉框参数，点击联动选择后将结果通过url传递至后端。后端Controller通过HttpServletRequest获取页面url路径中的选择结果，利用File的listFiles()和.size()方法获取文件下图片集合和图片数量，进而通过Model的addAttribute返回前端渲染，实现筛选后读取并显示图片。 效果 实现过程
HTML，img标签src路径错误及src路径图片无法显示问题，相对路径和绝对路径，超级详细的新手教程。
热门推荐
weixin_42868605的博客
06-01 3万+
今天在学习 做实例的时候 发现 img 标签里面的图片不显示， 结果是路径的问题，在这写下 路径的正确写法，方便以后查阅， 路径用 \ 或者 / 表示， 但是最后 图片名的时候 必须用 / 还有 路径前面的 两个点 不能漏掉 人生就像一只储蓄罐,你投入的每一分努力,都会在未来的某一天,回馈于你。而你所要做的,就是每天多努力一点. ...
Springboot整合thymeleaf中拿到静态资源以及背景图片
cgl_dong的博客
06-03 2万+
Springboot支持许多模板引擎，我在使用thymeleaf时总是拿不到静态资源，其中背景图片总是拿不到，网上找的方法基本都试过，还是不行，想到可能是版本兼容问题，缓存问题，于是换了依赖，消除缓存，重建模块，解决了一些小问题，但是背景图片总是拿不到，找了好多其他开发者开发好的代码，尝试了好多次才成功拿到，写来记录一下，还有就是在调试过程中对浏览器的抓包功能有了很深的印象 目录如下 static...
SpringBoot + Apache Shiro + Mybatis Plus + Thymeleaf 实现的内容管理系统
04-28
采用SpringBoot + Apache Shiro + Mybatis Plus + Thymeleaf 实现的内容管理系统(附带权限管理)，是搭建博客、网站的不二之选。 技术栈：Spring Boot、Apache Shiro、MyBatis-Plus、Alibaba Druid、Redis、MySQL、...
forum:springboot+mybatis+thymeleaf博客论坛
05-14
基于 SpringBoot + MyBatis + Thymeleaf 实现的博客/论坛系统。 详细地址： 同版论坛地址 主要技术 SpringBoot2.x MyBatis-Plus3.x Thymeleaf MySQL5.x (建议5.6+)或 MySQL8.x Maven 3.5 本地启动教程 使用 IDEA/...
SpringBoot+Shiro+Mybatis+Thymeleaf个人博客前后台管理系统
08-01
将本项目源码导入本地开发工具(如 IntelliJ IDEA )，本地开发工具需要安装 lombok 插件 安装Mysql数据库：Mysql版本最低支持5.7，新建 database CREATE DATABASE pb_cms_base; 初始化数据库：找到项目数据库文件:...
基于SpringBoot+Mybatis+Thymeleaf架构实现的员工管理系统（源码+数据库）.zip
06-27
本资源中的源码都是经过本地编译过可运行的，下载后按照文档配置好环境就可以运行。资源项目的难度比较适中，内容都是经过助教老师审定过的，应该能够满足学习、使用需求，如果有需要的话可以放心下载使用。有任何...
基于SpringBoot+Thymeleaf的招聘系统，数据库为MySQL+Druid+MyBatis，搭配Redis内存数据库
06-20
该网站是基于SpringBoot实现的企业招聘系统，应用于求职者投递简历，公司HR进行审核。 主要涉及技术包含Maven、Spring、SpringBoot、MyBatis、Redis等。 项目前端模板引擎使用Thymeleaf，数据源使用Druid。 使用...
[springboot]在thymeleaf中根据数据库和本地路径显示图片
cookie_turbo的博客
12-07 5026
数据表设计 后台将数据集合装入list,通过model.addAttribute传递数据到前端 前端thymeleaf页面代码 如有相关问题欢迎咨询
Spring boot +Thymeleaf 本地图片加载失败（图片路径）的问题及解决方法
做笔记\记录遇到的程序bug
09-06 2337
在Spring Boot应用程序中，有时候我们会遇到本地图片不能加载的问题，这通常是由于图片路径不正确导致的。在本文中，我们将详细讲解这个问题的原因，并提供两个示例来说明如何解决这个问题。
Thymeleaf动态获取图像链接获取session值
Cogjen的博客
11-17 913
刚学Thymeleaf遇到的坑 1、在你的方法里面拼接好Thymeleaf语法路径，存在session里面（我的路径是本地路径+图片名字） 2、相对路径要：th:src="@{/avatar/xxx.jpg}“才能获取图像 3、拼接路径要：th:src=”KaTeX parse error: Expected '}', got 'EOF' at end of input: …l="@{xx/xx/(xx={session值})} ...
使用 MySQL、Thymeleaf 和 Spring Boot Framework 上传、存储和查看图像
allway2的博客
12-08 1961
该接口用于从数据库中获取特定图像的 byte[] 形式，并将其转换为 jpeg、png、jpg 或 gif 格式以显示在浏览器中。之后，我们将图像转换为字节数组，并将所有与图像相关的详细信息（例如名称，描述，图像等）存储到MySQL数据库中。在我们的例子中，我们以字节数组的形式存储图像。在控制器类中，我们将创建 API，以存储和获取来自 MySQL 数据库的图像。在这里，我们将创建存储库，该存储库将与我们的数据库通信并执行所有类型的。在此步骤中，我们将定义实体类，该实体类将与数据库中存在的表进行映射。
springmvc 框架中 用img标签展示本地磁盘的图片
一言不合就写博客
10-10 3011
jsp方面很简单，一个img元素就可以搞定，主要是把src指向controller的路径即可 Java方面也很简单，见代码 @RequestMapping("/showImage") public void showImage(HttpServletResponse response,String path) throws Exception {           try{    
thymeleaf字段中list显示图片
chenqinghu98的博客
08-17 416
thymeleaf字段中list显示图片
SpringBoot(51)整合Thymeleaf实现图片上传并显示
qq_43025316的博客
12-01 2878
SpringBoot(51)整合Thymeleaf实现图片上传并显示 直接上代码 1.代码结构 2.导入Thymeleaf依赖 <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-thymeleaf</artifactId> </dependency> 3.index页面 <!DOCTY
请问我想用spring通过mybatis依赖并运用Thymeleaf模板技术将数据库中的表格显示在html页面上该如何实现
06-08
要通过Spring和MyBatis依赖并运用Thymeleaf模板技术将数据库中的表格显示在HTML页面上，你可以按照以下步骤实现： 1. 在pom.xml文件中添加Spring Boot、MyBatis和Thymeleaf的相关依赖： ```xml <dependencies> <!-- Spring Boot dependencies --> <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-web</artifactId> </dependency> <!-- MyBatis dependencies --> <dependency> <groupId>org.mybatis.spring.boot</groupId> <artifactId>mybatis-spring-boot-starter</artifactId> <version>2.2.0</version> </dependency> <dependency> <groupId>com.h2database</groupId> <artifactId>h2</artifactId> <version>1.4.200</version> </dependency> <!-- Thymeleaf dependencies --> <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-thymeleaf</artifactId> </dependency> </dependencies> ``` 2. 在application.properties配置文件中配置数据库和MyBatis的相关参数： ```properties # Data Source Configuration spring.datasource.driverClassName=org.h2.Driver spring.datasource.url=jdbc:h2:mem:testdb spring.datasource.username=sa spring.datasource.password= # MyBatis Configuration mybatis.mapper-locations=classpath:mapper/*.xml mybatis.type-aliases-package=com.example.demo.domain ``` 3. 创建数据库表格对应的实体类，并在MyBatis的映射文件中编写SQL语句： ```java package com.example.demo.domain; public class User { private Long id; private String name; private Integer age; // Getters and Setters } ``` ```xml <!-- /src/main/resources/mapper/UserMapper.xml --> <mapper namespace="com.example.demo.mapper.UserMapper"> <select id="selectAll" resultType="com.example.demo.domain.User"> SELECT * FROM user </select> </mapper> ``` 4. 创建MyBatis的Mapper接口： ```java package com.example.demo.mapper; import com.example.demo.domain.User; import org.apache.ibatis.annotations.Mapper; import org.apache.ibatis.annotations.Select; import java.util.List; @Mapper public interface UserMapper { @Select("SELECT * FROM user") List<User> selectAll(); } ``` 5. 在Spring Boot项目中创建Controller，并在其方法中调用MyBatis的Mapper接口获取数据，并将数据传递给Thymeleaf模板： ```java package com.example.demo.controller; import com.example.demo.mapper.UserMapper; import org.springframework.stereotype.Controller; import org.springframework.ui.Model; import org.springframework.web.bind.annotation.GetMapping; @Controller public class UserController { private final UserMapper userMapper; public UserController(UserMapper userMapper) { this.userMapper = userMapper; } @GetMapping("/") public String index(Model model) { model.addAttribute("users", userMapper.selectAll()); return "index"; } } ``` 6. 创建Thymeleaf模板，并在其中使用Thymeleaf标签和表达式来显示数据： ```html <!DOCTYPE html> <html xmlns:th="http://www.thymeleaf.org"> <head> <meta charset="UTF-8"> <title>User List</title> </head> <body> <table> <thead> <tr> <th>ID</th> <th>Name</th> <th>Age</th> </tr> </thead> <tbody> <tr th:each="user : ${users}"> <td th:text="${user.id}"></td> <td th:text="${user.name}"></td> <td th:text="${user.age}"></td> </tr> </tbody> </table> </body> </html> ``` 以上就是通过Spring和MyBatis依赖并运用Thymeleaf模板技术将数据库中的表格显示在HTML页面上的基本步骤，你可以根据实际需求进行调整和扩展。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 15
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值