修复脚本/ css的相对路径,同时重写URL

Question

我正在JBoss AS 6.1.0.Final中使用JSF2.1和RichFaces 4.1.现在,我专注于重写URL.在尝试了不同的方法之后,我决定坚持使用PrettyFaces,因为它非常直观易用(并在几分钟内完成).

有一个问题很难.脚本/ css的相对链接搞砸了,因为URL已更改,相对路径最终在404.我可以使用绝对路径但这会强制我更改许多页面并在页面的源代码中公开应用程序的结构.

我正在考虑一个暂时的解决方法:给予支持bean管理这些相对链接的不同级别的责任,但重新使用bean使这成为一个微妙的问题.

我的问题是,在重写URL时是否有定义的方法或最佳实践来管理这些相对路径？

编辑

h:outputStylesheet和h:outputScript就像一个魅力.剩下的就是解决以相对方式引用图像的CSS的一个小问题.采取这种结构:

-------/resources
       |
       ---_img
       |
       ---_css
       |
       ---_js

文件夹中的CSS文件_css引用image1.png位于_img具有相对路径的文件夹中的图像../_img/image1.png.问题是这最终会在404中找到,因为它找不到图像/myApp/javax.faces.resource/_img/image1.png.

更改每../对#{request.contextPath}/resources的CSSS里面似乎工作得很好,但我不知道是否有更好的方式来做到这一点.相对路径方法不起作用对我来说似乎很奇怪.

Answer 1

首先,我不明白他们是如何以及为什么他们搞砸了.你不清楚这一点.很可能你出于某种原因硬编码纯HTML <script>和<link>(和<img>)元素,而不是使用JSF提供的<h:outputScript>和<h:outputStylesheet>(和<h:graphicImage>)组件.那些JSF组件可以获取与/resources文件夹相关的资源名称,它们将自动为上下文路径添加前缀,使其最终位于域相对URL(带有前导斜杠)而不是请求相对URL(没有前导)削减).

给定以下文件夹结构(/resources文件夹名称已预先定义;您无法更改其名称):

WebContent
 |-- resources
 |    |-- css
 |    |    `-- style.css
 |    |-- img
 |    |    `-- logo.png
 |    `-- js
 |         `-- script.js
 |-- page.xhtml
 :

然后,你应该能够让JSF生成正确的<script>,<link>(和<img>)元素自动将如下:

<h:head>
    <h:outputStylesheet name="css/style.css" />
    <h:outputScript name="js/script.js" />
</h:head>
<h:body>
    <h:graphicImage name="img/logo.png" />
</h:body>

也可以看看:

• 如何在Facelets模板中引用CSS/JS /图像资源？
• JSF 2规范 - 第2.6章资源处理