针对IDEA中Javaweb项目中无法加载图片

一、项目的结构及问题介绍

1. 项目结构如下：

2. 在500.jsp页面中访问了img目录下的相关图片,比如背景图片，我在500.jsp中是这样写的路径

   background: url(../img/500.png) 0 0 no-repeat;
   

   虽然在IDEA中能够正常的预览到图片，但是在生成项目的war包时，项目的目录结构却会发生变化，可能与我创建项目的方式有关，我这生成的结构还是和源码中的结构一样，即error/500.jsp和img/500.png，此时文件所在的文件夹还是同级目录，但是在500.jsp却就是无法访问到这个图片

二、解决方案

这个问题的解决方案就是加上web应用的Application context地址，具体的意思就是网站应用的首页地址，这个具体的地址要看你的Tomcat配置。

1. 查找项目对应的Application context，操作捕捉如下

   • 
   • [外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-fqyGbZ3L-1599136276346)(C:\Users\wanglin\AppData\Roaming\Typora\typora-user-images\image-20200903163530542.png)]

2. 按照上图的步骤就找到了你的项目的application context，然后接下在你要访问的图片地方，将其路径改为：

   url(/你的项目application context/你的图片的路径地址)
   

   比如我上面的一个错误无法访问图片的例子

   background: url(../img/500.png) 0 0 no-repeat;
   

   修改之后的应该是这样的：

   background: url(/Javaweb_jsp_war_exploded/img/500.png) 0 0 no-repeat;
   

3. 再次重新启动项目，然后就可以看到页面中可以正常显示图片了，加油啊！

补充：

可以将application context设置为 /,那么上面的路径地址为：

background: url(/img/500.png) 0 0 no-repeat;