# javaweb中图片无法显示图片的问题

我在idea中编写javaweb， 没有使用web模板， 直接创建maven项目， 然后子项目中加入web框架。出现了图片无法显示的问题。 最后找到原因是因为包含静态资源的目录没有声明为资源目录， 这样就无法将静态资源加入到tomcat下的目标文件中。 解决办法， 将包含图片等静态资源的目录/文件声明为资源文件。下面进行详细描述：

---

首先看一下我的项目结构和代码：

image-20210913142638122.png

图1 项目结构

橙色部分是生成的目标文件， 下面的web目录是我们写入的代码和资源， 我在/web/img中加入了图片500.jpeg图片并想要在页面发生错误时加载出来，代码如下

image-20210913152442423.png

图2 error源码

注：请看图片的路径， 网上有人说应该写入"../img/500.jpeg",着多种说法是错的哈， 我清楚他们的意思， 从error.jsp使用相对路径找到500.jpeg， 但是这是项目中的路径， tomcat不认识的， 它只认识生成的out， 也只执行那个out， 更准确点讲， 在tomcat中根路径就是图一中的jsp_war_exploded那个war包。其他的都不好使， 而且不认相对路径。懂？

回归正题， 上面的代码很简单有没有， 就是标签加入一个图片， 然后我们发现在浏览器上无法加载出图片， 显示图片未找到：

image-20210913143105892.png

图3 图片未找到

因为服务器在寻找资源的时候是按照目标文件的结构路径去寻找的， 所以我们在返回图1， 发现img文件夹下根本没有500.jpeg， 说明在生成目标文件的时候， 没有将静态资源加入到目标文件中去， 我查询了很多资料， 试了很多网上的方法， 也没有解决问题， 下面我给出自己总结的两个方法：

1， 简单粗暴：将图片手动加到out目录下的img中去， 就可以找到了， 哈哈， 很笨的方法。

2，“投机取巧”： 将img标记为资源目录， 这样重新启动项目， 也会将图片加进来， 不过这样做的话， 我们的项目目录下也会生成一个target， 不过不用管， 删除就好了。

最后请看效果图：

image-20210913154850882.png

---

下面我来说说为什么我讲第二种方法是投机取巧的呢， 这里需要先介绍一点小知识， target目录和out目录都是在idea中编写javaweb程序时生成的目标文件， 不同的是target是module子项目的目录， 而out是整个项目的目录， 如果你使用过webapp模板， 没多加一个module就会多一个target， 而out只有一个。 那么大家应该记得我说过自己写的这个程序没有使用模板， 所以我只要把某一个文件标记为资源目录或者源代码目录， 就会生成一个target目录， 相应的文件会存储在自动加入target\class文件加下， 但是out中也会添加， 所以第二种方法是将img文件夹当做一个子module中的文件了， 你说是不是投机取巧呢。

不过大家也不用担心， 因为这个问题是在不用框架的情况下才会出现， 我们大部分情况之下还是会使用框架编写代码的， 那样比较规范， 也比较安全。