java - 在重写 URL 时修复脚本/css 的相对路径

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 文件引用了位于 _img 文件夹中的图像 image1.png，其相对路径为 。 ./_img/image1.png。问题是这最终会出现 404，因为它没有在 /myApp/javax.faces.resource/_img/image1.png 中找到图像。

在 CSS 中为 #{request.contextPath}/resources 更改每个 ../ 似乎工作得很好，但我想知道是否有更好的方法它。相对路径方法不起作用对我来说似乎很奇怪。

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>

另见:

• How to reference CSS / JS / image resource in Facelets template?
• JSF 2 specification - 第 2.6 章资源处理