IDEA中Javaweb項目圖片加載不出來解決方案
一、項目的結(jié)構(gòu)及問題介紹
項目結(jié)構(gòu)如下:
在500.jsp頁面中訪問了img目錄下的相關(guān)圖片,比如背景圖片,我在500.jsp中是這樣寫的路徑
background: url(../img/500.png) 0 0 no-repeat;
雖然在IDEA中能夠正常的預(yù)覽到圖片,但是在生成項目的war包時,項目的目錄結(jié)構(gòu)卻會發(fā)生變化,可能與我創(chuàng)建項目的方式有關(guān),我這生成的結(jié)構(gòu)還是和源碼中的結(jié)構(gòu)一樣,即error/500.jsp和img/500.png,此時文件所在的文件夾還是同級目錄,但是在500.jsp卻就是無法訪問到這個圖片
二、解決方案
這個問題的解決方案就是加上web應(yīng)用的Application context地址,具體的意思就是網(wǎng)站應(yīng)用的首頁地址,這個具體的地址要看你的Tomcat配置。
查找項目對應(yīng)的Application context,操作捕捉如下
按照上圖的步驟就找到了你的項目的application context,然后接下在你要訪問的圖片地方,將其路徑改為:
url(/你的項目application context/你的圖片的路徑地址)
比如我上面的一個錯誤無法訪問圖片的例子
background: url(../img/500.png) 0 0 no-repeat;
修改之后的應(yīng)該是這樣的:
background: url(/Javaweb_jsp_war_exploded/img/500.png) 0 0 no-repeat;
再次重新啟動項目,然后就可以看到頁面中可以正常顯示圖片了,加油??!
補充:
可以將application context設(shè)置為 /,那么上面的路徑地址為:
background: url(/img/500.png) 0 0 no-repeat;
到此這篇關(guān)于IDEA中Javaweb項目圖片加載不出來解決方案的文章就介紹到這了,更多相關(guān)IDEA Javaweb圖片加載內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
Java利用Jsoup解析和操作HTML的技術(shù)指南
在現(xiàn)代 Java 開發(fā)中,處理 HTML 數(shù)據(jù)是一項常見需求,無論是抓取網(wǎng)頁數(shù)據(jù)、解析 HTML 文檔,還是操作 DOM 樹,Jsoup 都是一個強大的工具,本文將介紹 Jsoup 的基本功能,并通過多個詳細(xì)的代碼示例展示如何使用它解析和操作 HTML,需要的朋友可以參考下2025-03-03解決Maven 項目報錯 java.httpservlet和synchronized使用方法
下面小編就為大家?guī)硪黄鉀QMaven 項目報錯 java.httpservlet和synchronized使用方法。小編覺得挺不錯的,現(xiàn)在就分享給大家,也給大家做個參考。一起跟隨小編過來看看吧2017-07-07springboot下mybatis-plus如何打印sql日志和參數(shù)到日志文件
本文主要介紹了springboot下mybatis-plus如何打印sql日志和參數(shù)到日志文件,文中通過示例代碼介紹的非常詳細(xì),具有一定的參考價值,感興趣的小伙伴們可以參考一下2022-03-03SpringBoot中的五種對靜態(tài)資源的映射規(guī)則的實現(xiàn)
這篇文章主要介紹了SpringBoot中的五種對靜態(tài)資源的映射規(guī)則的實現(xiàn),文中通過示例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2019-12-12java 中 System.out.println()和System.out.write()的區(qū)別
這篇文章主要介紹了 java 中 System.out.println()和System.out.write()的區(qū)別.的相關(guān)資料,需要的朋友可以參考下2017-04-04Java 中的 BufferedWriter 介紹_動力節(jié)點Java學(xué)院整理
BufferedWriter 是緩沖字符輸出流。它繼承于Writer。接下來通過本文給大家分享Java 中的 BufferedWriter知識,需要的朋友參考下吧2017-05-05