无法在 Spring Boot 中加载图像答案

【问题标题】：Cannot Load Image in Spring Boot无法在 Spring Boot 中加载图像
【发布时间】：2021-11-10 19:14:18
【问题描述】：

我正在使用 Spring Boot 和 Thymeleaf 制作体育电子商务网站，并且在特定产品的产品页面和编辑页面的索引中，我无法查看产品的图像。 This is how the edit a product page (inspect on Chrome) looks

这是编辑产品的 HTML 代码。当前图像下方的行是为编辑和索引生成错误的行。

<div class="form-group">
                <label for="">Image:</label>
                <input type="file" class="form-control" th:name="file" th:id="file">
                <img class="mt-2" src="#" alt="" id="imgPreview1">
                <br><br>
                <label for="">Current image:</label>
                <img style="width: 100px;" th:src="@{'media/'+${product.image}}"> 
            </div>

我从 src/main/resources/static/media 的媒体文件夹中获取图像，并从数据库中获取产品名称。从数据库中获取图像文件的名称没有错误。它看起来像一个路径错误，但我似乎无法弄清楚。

【问题讨论】：

标签： html spring spring-boot image thymeleaf

【解决方案1】：

您的HTML 或JSP 页面始终位于../resources/templates/ 中，并且您的图像路径为../resources/static/media/。要从static 文件夹中获取图像，您需要使用templates 文件夹中的../ 返回并转到media 文件夹并获取图像...

变化：

../resources/static/media/liverpool_21_22_home_kit.jpg

收件人：

../media/liverpool_21_22_home_kit.jpg

【讨论】：

您所说的并不完全有效，但我对其进行了修改，并找到了下面给出的正确代码。

【解决方案2】：

在spring boot中，页面默认在“templates”文件夹下搜索，资源默认映射在“static”文件夹下。要访问静态文件夹下的图像文件，请尝试

/image-path/image.ext

例如，我在静态下有一个 src 文件夹，它有一些图像，然后是 logo.png，

/src/logo.png

【讨论】：

我试过了。我尝试了不同的路径变体无济于事。你觉得还有别的办法吗？
我在使用 Spring Boot 设置服务器时遇到了和你一样的问题。这是框架映射资源的默认方式。检查资源位置的最佳方法是在浏览器中通过开发人员模式编辑资源路径，并检查示例资源的不同路径。你可以在这里找到如何在浏览器上使用开发者模式helpdeskgeek.com/free-tools-review/…（以 Chrome 为例）
你试过把“/”放在像th:src="@{'/media/'+${product.image}}这样的媒体之前吗
是的，我试过了。我尝试了不同的路径来修复它，但它不起作用。但我想我可能已经发现了问题所在。因此，当我进入开发工具页面时，当我将鼠标悬停在图像上时，它显示的链接是 admin/products/edit//media/。也许如果它指向 src/main/resources/static/media/ 它可能会起作用。但我不知道该怎么做