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

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

  1. 项目结构如下:

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

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

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

二、解决方案

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

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

  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;

IDEA中Javaweb项目图片加载不出来解决方案的更多相关文章

  1. Android中常见的图片加载框架

    图片加载涉及到图片的缓存.图片的处理.图片的显示等.而随着市面上手机设备的硬件水平飞速发展,对图片的显示要求越来越高,稍微处理不好就会造成内存溢出等问题.很多软件厂家的通用做法就是借用第三方的框架进行 ...

  2. AngularJS中如果ng-src 图片加载失败怎么办

    我们知道AngularJS加载图片的方法是用技术分享加ng-src标签,例如: <img ng-src="{{currentUrl}}"/> 其中currentUrl为 ...

  3. 【Android】安卓中常用的图片加载方法

    一.通过相机选图片: 布局文件: <?xml version="1.0" encoding="utf-8"?> <LinearLayout x ...

  4. vue+webpack项目打包后背景图片加载不出来问题解决

    在做VUE +的WebPack脚手架项目打包完成后,在IIS服务器上运行发现项目中的背景图片加载不出来检查项目代码发现是因为CSS文件中,背景图片引用的路径问题;后来通过修改配置文件,问题终于解决了, ...

  5. Android高效异步图片加载框架

    概述 Android高效异步图片加载框架:一个高效的异步加载显示的图片加载框架,同时具备图片压缩,缓存机制等特性. 详细 代码下载:http://www.demodashi.com/demo/1214 ...

  6. 图片加载时间缓慢问题API

    一.背景       最近段时间,开发写值工具项目中,出现图片加载问题API,响应时间缓慢:为了优化图片加载问题,我进行图片压缩方法,然后API的图片加载还是慢,最终在自己无意中乱写找到了根本的原因. ...

  7. Android 框架修炼-自己开发高效异步图片加载框架

    一.概述 目前为止,第三方的图片加载框架挺多的,比如UIL , Volley Imageloader等等.但是最好能知道实现原理,所以下面就来看看设计并开发一个加载网络.本地的图片框架. 总所周知,图 ...

  8. js图片加载效果(延迟加载+瀑布流加载)

    概述 两种图片加载的效果:一种是遇到图片较多时,带读条效果的加载提示:另一种是根据滑块的位置进行预加载,用户不察觉的情况下,实现瀑布流的加载效果 详细 代码下载:http://www.demodash ...

  9. Android项目框架之图片加载框架的选择

    本文来自http://blog.csdn.net/liuxian13183/ ,引用必须注明出处! 从Android爆发以后,自定义的控件如EditTextWithDelete.ActionBar.P ...

随机推荐

  1. C#算法设计排序篇之01-冒泡排序(附带动画演示程序)

    冒泡排序(Bubble Sort) 该文章的最新版本已迁移至个人博客[比特飞],单击链接 https://www.byteflying.com/archives/672 访问. 它重复地访问要排序的元 ...

  2. 什么是P,NP和NPC问题?

    P问题,NP问题,NPC问题?这些都是计算机科学领域,关于算法方面的术语.在认识这些术语之前,建议同学们先认真学习一下算法的时间复杂度,因为算法的时间复杂度与P,NP和NPC问题高度相关. 什么是P问 ...

  3. phpstudy后门利用复现

    一.漏洞位置 程序自带的PHP的php_xmlrpc.dll模块中有隐藏后门,受影响的版本有phpstudy2016(php5.2/5.4).phpstudy2018(php5.2/5.4)等版本. ...

  4. echarts 导出为word文档

    https://www.jianshu.com/p/5bd47ab59bbe 主要思路:前台echarts生成图片后,获取base64码,传给后台解析,然后写入freemarker模板,进行下载. 图 ...

  5. JavaScript学习系列博客_29_JavaScript arguments

    arguments (封装实参的对象) 在调用函数时,浏览器每次都会传递进两个隐含的参数:1.函数的上下文对象 this2.封装实参的对象 arguments- arguments是一个类数组对象,它 ...

  6. Centos7 KVM启用嵌套虚拟化

    [root@kvm-hypervisor ~]# cat /etc/modprobe.d/kvm-nested.conf options kvm-intel nested= options kvm-i ...

  7. Kafka工作流程

    Kafka生产过程分析 1 写入方式 producer采用推(push)模式将消息发布到broker,每条消息都被追加(append)到分区(patition)中,属于顺序写磁盘(顺序写磁盘效率比随机 ...

  8. Mysql 如何实现全文检索,关键词跑分

    一.前言 今天一个同事问我,如何使用 Mysql 实现类似于 ElasticSearch 的全文检索功能,并且对检索关键词跑分?我当时脑子里立马产生了疑问?为啥不直接用es呢?简单好用还贼快.但是听他 ...

  9. 微信小程序自动化

    解析微信小程序 注意:若上面方法不行就使用下面的 小程序对应的chrome驱动版本包,2.4版本的

  10. JMH--一款由OpenJDK开发的基准测试工具

    什么是JMH JMH 是 OpenJDK 团队开发的一款基准测试工具,一般用于代码的性能调优,精度甚至可以达到纳秒级别,适用于 java 以及其他基于 JVM 的语言.和 Apache JMeter ...