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

时间:2012-08-08 18:32:12

标签: java jsf-2 url-rewriting prettyfaces

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

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

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

我的问题是,在重写网址时是否有定义的方法或最佳做法来管理这些相对路径?

编辑

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中找不到图像。

在CSS中更改../的每个#{request.contextPath}/resources似乎工作正常,但我想知道是否有更好的方法来做到这一点。相对路径方法不起作用对我来说似乎很奇怪。

2 个答案:

答案 0 :(得分:5)

首先,我不明白他们是如何以及为什么他们搞砸了。你不清楚这一点。您很可能出于某种原因硬编码纯HTML <script><link>(和<img>)元素,而不是使用JSF提供的<h:outputScript>和{{3} }(和<h:outputStylesheet>)组件。那些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>

另见:

答案 1 :(得分:2)

您需要为CSS文件使用绝对URL,例如:

/path/to/style.css

而不是:

../style.css

如果可以提供帮助,您还希望避免使用硬编码网址,并使用JSF2资源重定位功能:<h:outputStylesheet><h:outputScript>

以下是一些可能有用的链接:

http://ocpsoft.org/support/topic/problem-with-prettyfaces-and-primefaces