spring boot 本地图片不能加载（图片路径）的问题及解决方法

在使用html加载图片时，发现本地图片在页面上不能显示，但是直接引用网络上的资源是可以显示的。参考了众多前人的经验，得出一下结论：

本地图片不能显示最主要的问题是，图片在本地url和图片在服务器上被加载是的URL是不一样的。也就是路径的问题。

解决的办法其实很简单，只要写一个配置文件，也就是图片位置的转化器，原理是虚拟一个在服务器上的文件夹，与本地图片的位置进行匹配。

在调用本地图片时，就相当于调用服务器上的图片。

关键的代码如下：

 @Configuration
public class MyWebAppConfiguration extends WebMvcConfigurerAdapter {
  @Override
  public void addResourceHandlers(ResourceHandlerRegistry registry) {
 /**
 * @Description: 对文件的路径进行配置,创建一个虚拟路径/Path/** ，即只要在<img src="/Path/picName.jpg" />便可以直接引用图片
 *这是图片的物理路径 "file:/+本地图片的地址"
 * @Date： Create in 14:08 2017/12/20
 */   registry.addResourceHandler("/Path/**").addResourceLocations("file:/E:/WebPackage/IdeaProjects/shiroLearn/src/main/resources/static/");
    super.addResourceHandlers(registry);
  }
}

下面看下Spring boot html中无法读取本地图片问题

需要设置spring boot的静态资源路径，具体为在application.properties中添加：

spring.resources.static-locations='静态资源路径'

如以下配置指定了类路径作为静态资源路径:

spring.resources.static-locations=classpath:/

如果我的图片qiaoba.jpeg放在了src/main/resoruces/images下，那么我可以在html中如此引用图片：

<img alt="qiaoba" src="images/qiaoba.jpeg">

总结

以上所述是小编给大家介绍的spring boot 本地图片不能加载（图片路径）的问题及解决方法，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对我们网站的支持！

赞 (0)

相关推荐

  • springboot 默认静态路径实例解析

    springboot 默认静态路径实例解析

    这篇文章主要介绍了springboot 默认静态路径实例解析,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下 代码如下所示 类ResourceProperties.class private static final String[] CLASSPATH_RESOURCE_LOCATIONS = new String[]{"classpath:/META-INF/resources/", "classpath:/resourc

  • SpringBoot项目修改访问端口和访问路径的方法

    创建SpringBoot项目,启动后,默认的访问路径即主机IP+默认端口号8080:http://localhost:8080/ 此时,我们就可以访问Controller层的接口了,如:http://localhost:8080/hello package com.springboot.test; import org.springframework.web.bind.annotation.RequestMapping; import org.springframework.web.bind.a

  • SpringBoot图片上传和访问路径映射

    简介 做移动端对接,框架用的SpringBoot,接口RESTful,实现一个图片上传功能,图片上传是个经典的应用场景了,完成后,做个笔记记录一下,希望能帮到攻城狮们 开发步骤 1.先贴图片上传工具类 package com.prereadweb.utils; import java.io.File; import java.io.FileOutputStream; import java.util.UUID; /** * @Description: 文件工具类 * @author: Yangx

  • spring boot2.0图片上传至本地或服务器并配置虚拟路径的方法

    最近写了关于图片上传至本地文件夹或服务器,上传路径到数据库,并在上传时预览图片.使用到的工具如下: 框架:spring boot 2.0 前端模板:thymeleaf 图片预览:js 首先,上传以及预览,js以及<input type="file">,以及预览图片的JS function Img(obj){ var imgFile = obj.files[0]; console.log(imgFile); var img = new Image(); var fr = ne

  • spring boot加载资源路径配置和classpath问题解决

    1.spring boot默认加载文件的路径: /META-INF/resources/ /resources/ /static/ /public/ 我们也可以从spring boot源码也可以看到: private static final String[] CLASSPATH_RESOURCE_LOCATIONS = { "classpath:/META-INF/resources/", "classpath:/resources/", "classp

  • Spring boot 默认静态资源路径与手动配置访问路径的方法

    在application.propertis中配置 ##端口号 server.port=8081 ##默认前缀 spring.mvc.view.prefix=/ ## 响应页面默认后缀 spring.mvc.view.suffix=.html # 默认值为 /** spring.mvc.static-path-pattern=/** # 这里设置要指向的路径,多个使用英文逗号隔开,默认值为 classpath:/META-INF/resources/,classpath:/resources/,

  • springboot如何获取相对路径文件夹下静态资源的方法

    springboot如何获取相对路径文件夹下静态资源的方法

    今日遇到一个问题:springboot需要获取到一个自定义名称文件夹下的静态资源(图片等),并且文件夹的路径不在classPath下面,而是一个相对路径. 一开始使用修改配置文件的方式: # 配置静态资源访问前缀 spring.mvc.static-path-pattern=*/** # 配置静态资源路径,默认配置失效 spring.resources.static-locations=../upload 发现并不行,无法解析出相对路径. 后面通过自定义静态资源映射配置类实现了: @Config

  • AngularJS使用ng-inlude指令加载页面失败的原因与解决方法

    本文实例讲述了AngularJS使用ng-inlude指令加载页面失败的原因与解决方法.分享给大家供大家参考,具体如下: AngularJS中提供的ng-include指令,很类似于JSP中的<jsp:include>用来将多个子页面合并到同一个父页面中,避免父页面过大,可读性差,不好维护. 父页面parent.html代码如下: <html> <head> <script src="angular-1.2.2/angular.js">&

  • 基于Bootstrap模态对话框只加载一次 remote 数据的解决方法

    基于Bootstrap模态对话框只加载一次 remote 数据的解决方法

    摘要: 前端框架 Bootstrap 的模态对话框,可以使用 remote 选项指定一个 URL,这样对话框在第一次弹出的时候就会自动从这个地址加载数据到 .modal-body 中,但是它只会加载一次,不过通过在事件中调用 removeData() 方法可以解决这个问题. 1. Bootstrap 模态对话框和简单使用 <div id="myModal" class="modal hide fade"> <div class="moda

  • Vue中 v-if 和v-else-if页面加载出现闪现的问题及解决方法

    vue中v-if 和v-else-if在页面加载的时候,不满足条件的标签会加载然后再消失掉,如果要解决这个问题,案例如下: vue html代码块: <div id="divApp"> <div v-if="type === 'A'" v-cloak> A </div> <div v-else-if="type === 'B'" v-cloak> B </div> <div v-e

  • IDEA2020 1.1中Plugins加载不出来的问题及解决方法

    进入File->Setting 如图,取消勾选,点击确认后重启,点击了以后等一会就可以正常显示 ps:下面看下解决IDEA 2020.1.1 找不到程序包和符号 问题描述 IDEA 2020.1.1 maven项目build的时候报错,找不到程序包,找不到符号. IDEA 2020.1.1 maven project: cannot find package, cannot find symbol. 思考 项目是maven,使用mvn clean package可以完成编译.说明问题不在操作系统

  • vue项目中图片懒加载时出现的问题及解决

    vue项目中图片懒加载时出现的问题及解决

    目录 vue图片懒加载的问题 vue图片懒加载实现步骤 vue图片懒加载踩过的坑 今天踩过的坑总结 vue图片懒加载的问题 项目中遇到一个问题,记录一下,vue项目中前期没有做图片懒加载的时候,当图片出现错误或者显示路径不对,我加了onerror事件进行错误监听并添加一张默认的图片,优化用户体验. 后期因为图片数量变多,所以加入了图片懒加载,但在懒加载中挂载时只加了loading的图片,没有加error,所以导致页面图片未正常加载的地方出现默认图片闪烁的现象,最后在挂载时加入error引入一张默

  • Spring Boot如何排除自动加载数据源

    Spring Boot如何排除自动加载数据源

    目录 前言 1. mongodb 2. mybatis 3. 原理讲解 总结 解决方法 前言 有些老项目使用Spring MVC里面有写好的数据库连接池,比如redis/mongodb/mybatis(mysql其他Oracle同理).在这些项目迁入spring boot框架时,会报错. 原因是我们业务写好了连接池,但spring boot在jar包存在的时候会主动加载spring boot的autoconfiguration创建连接池,但我们并未配置Spring Boot参数,也不需要配置.

  • Spring Boot启动及退出加载项的方法

    在一个初春的下午,甲跟我说,要在Spring Boot启动服务的时候,设置表自增的起始值. 于是我用屁股想了一下,不就是在main方法里折腾嘛. 后来实际操作了一把,发现屁股被打了. 于是乎,找到官方文档(以2.1.4为例),找到这一段: 如果你需要在启动SpringApplication后执行一些具体的代码,你可以实现ApplicaitonRunner或者CommandLineRunner接口.两个接口都实现了一个工作方式相同的run方法,该方法仅会在SpringApplication.run

  • Spring加载XSD文件发生错误的解决方法

    有时候你会发现过去一直启动正常的系统,某天启动时会报出形如下面的错误: org.xml.sax.SAXParseException: schema_reference.4: Failed to read schema document 'http://www.springframework.org/schema/beans/spring-beans-2.0.xsd', because 1) could not find the document; 2) the document could no

  • asp.net无法加载oci.dll等错误的解决方法

    解决方法一 修复方法: 1:找到oracle客户端的安装目录,例如:E:/oracle/ora92,选中目录,在"属性--安全"里面删掉"ASP .NET.Users用户"然后再添加进去,并赋予"完全控制或者修改权限":将everyone赋予"完全控制或者修改权限",注意:网站的目录权限也要设置为ervryone完全访问,不然oracle好了,网站同样访问不了.重新启动.2:最简单直接的方法是启用ASP .Net用户模拟,在w

  • 加载flash9.ocx出现错误的解决方法

    加载flash9.ocx出现错误的解决方法

     如何解决? 方法一: 重新注册以下DLL文件,你在桌面上点"开始"."运行": regsvr32 Shdocvw.dll regsvr32 Shell32.dll (注意这个命令) regsvr32 Oleaut32.dll regsvr32 Actxprxy.dll regsvr32 Mshtml.dll regsvr32 Urlmon.dll 注意:第二个命令可以先不用输,输完这些命令后重新启动Windows,如果发现无效,再重新输入第二个命令. 方法二: 如

随机推荐