关于JAVA EE项目在WEB-INF目录下的jsp页面如何访问WebRoot中的CSS和JS文件(转)
在有Struts2部署的Java EE环境中,我们一般把jsp页面写在WebRoot\WEB-INF\content 目录下,这样使得jsp页面一定需要struts的控制转发才可访问,提高页面安全性。
PS:作为一个怀旧的人,依旧使用Eclipse,意思一样只是把JSP页面换到WebContent\WEB-INF。
但是今天在jsp页面中应用WebRoot目录中的css,js文件发现十分困难,先看看我的文件结构:
目标是在index.jsp中访问default.css。
defautl.css是在index.jsp目录的父目录的父目录的CSS目录下。所以我这样写:
ps:空格为故意添加,不知为何会自动变成博客园的网址
1
2
|
<link href="../ ../css/default.css" rel="stylesheet" type="text/css"/>
<link href="../ ../css/uploadify.css" rel="stylesheet" type="text/css"/>
|
在Eclipes中也出现超链接提示,说明目录正确,但是结果失败。
查询资料后,在百度百科中看到:
http://baike.baidu.com/view/1745468.htm
TomCat 服务器下的WEB-INF文件夹是一个非常安全的文件,在页面中不能直接访问其中的文件,必须通过web.xml文件对要访问的文件进行相应映射才能访问。
从上面的实验可以看出,不但是直接访问,使用” ../ ../ “之类的间接访问也不能成功。
在此多方查询资料之后,尝试使用如下方法访问:
1
2
3
4
|
1 <!-- 输出为项目根目录,即WebRoot -->
2 <%String path = request.getContextPath(); %>
3 <link href="${path}/css/default.css" rel="stylesheet" type="text/css"/>
4 <link href="${path}/css/uploadify.css" rel="stylesheet" type="text/css"/>
|
原理很简单,变量path值为项目根目录,而css就是此目录的子目录,自然可以访问。
可惜结果还是错,思考之,el表达式的${}是以page,request,session,application的顺序寻找匹配的项,而path并不在这个范围之内,也许在java脚本中直接定义的对象是局部作用域,而不是page作用域?可惜百度之后难以找到相关资料,不过结论应该是没错的。
既然EL表达式无法取出,那么java脚本应该可以达到目的吧?尝试如下:
1
2
3
|
<%String path = request.getContextPath(); %>
<link href="<%=path %>/css/default.css" rel="stylesheet" type="text/css"/>
<link href="<%=path %>/css/uploadify.css" rel="stylesheet" type="text/css"/>
|
果不其然,页面成功读出了css文件中的样式,达到目的。不过此页面中存在java脚本,不够规范,查询资料后,用以下纯EL表达式实现:
1
2
3
|
1 <c:set value="${pageContext.request.contextPath}" var="path" scope="page"/>
2 <link href="${path}/css/default.css" rel="stylesheet" type="text/css"/>
3 <link href="${path}/css/uploadify.css" rel="stylesheet" type="text/css"/>
|
先将ContextPath放如page中,再使用el表达式取出,问题得以解决。
WEB-INF目录下加载CSS和JS问题?????
http://topic.csdn.net/u/20100420/14/c4efb68c-ca03-46b9-8277-126bd1290ebe.html
此问题中,CSS和JS也在WEB-INF下,多方试验后我还是没能解决,望高手解答。
转自:http://www.cnblogs.com/coolhwm/archive/2011/11/27/2265272.html
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· .NET Core 中如何实现缓存的预热?
· 从 HTTP 原因短语缺失研究 HTTP/2 和 HTTP/3 的设计差异
· AI与.NET技术实操系列:向量存储与相似性搜索在 .NET 中的实现
· 基于Microsoft.Extensions.AI核心库实现RAG应用
· Linux系列:如何用heaptrack跟踪.NET程序的非托管内存泄露
· TypeScript + Deepseek 打造卜卦网站:技术与玄学的结合
· 阿里巴巴 QwQ-32B真的超越了 DeepSeek R-1吗?
· 【译】Visual Studio 中新的强大生产力特性
· 张高兴的大模型开发实战:(一)使用 Selenium 进行网页爬虫
· 【设计模式】告别冗长if-else语句:使用策略模式优化代码结构
2015-03-31 HDU1838:Chessboard(线性dp)
2015-03-31 HDU4223:Dynamic Programming?(简单dp)
2015-03-31 HDU1712:ACboy needs your help(分组背包)
2015-03-31 HDU1506: Largest Rectangle in a Histogram(最大子矩阵,好题动态优化左右边界)
2015-03-31 HDU1165: Eddy's research II(递推)
2015-03-31 HDU1158:Employment Planning(线性dp)
2015-03-31 HDU1081:To The Max(最大子矩阵,线性DP)