我可以将 EL 用于带有 JSF 的外部 CSS 文件吗？答案

【问题标题】：Can I use EL for external CSS files with JSF?我可以将 EL 用于带有 JSF 的外部 CSS 文件吗？
【发布时间】：2011-08-16 09:22:00
【问题描述】：

在我当前 JSF 项目的外部样式表中，有指向外部资源的硬编码链接，例如

.someId { background-image:url(/context/resources/images/example.jpg); }

在 JSF xhtml 文档中，我可以使用像 ${request.contextPath} 这样的 EL 表达式，但是如何将 EL 处理应用于 CSS 文件？

上下文路径的硬编码有一个缺点：Web 应用程序的上下文路径 - 示例中的 /context - 可以在部署时通过修改 web.xml 来更改（或者通过重命名 Web 应用程序存档文件，如果web.xml 中没有指定上下文），但指向 CSS 文件中资源的链接仍会指向未更改的硬编码上下文，并导致资源未找到错误。

【问题讨论】：

标签： css jsf el

【解决方案1】：

也许我误解了你的问题，但如果你所说的外部 css 只是指你自己的 css 不是 inline，那么使用 JSF 2.0，你可以在你的 css 中使用 EL，只要你包含它一个<h:outputStylesheet>。例如，我有一个具有这种结构的项目：

war
|__ WEB-INF
|   |__ *standardStuff*
|__ resources
|   |__ css
|   |   |__ style.css
|   |__ images
|       |__ image1.png
|__ xhtml
|   |__ index.xhtml

这显然不是完整的文件列表，但应该足以说明问题。然后我的 index.xhtml 中有这个：

<f:view xmlns:f="http://java.sun.com/jsf/core" 
    xmlns:h="http://java.sun.com/jsf/html" 
    xmlns:ui="http://java.sun.com/jsf/facelets">
  <h:head/>
  <h:body>
    <h:outputStylesheet library="css" name="style.css" target="head"/>
    <ui:include src="content.xhtml"/>
  </h:body>
</f:view>

在我的 css 中我有这样的东西：

.someClass {
    background-image: url('#{resource['images/image1.png']}');
}

【讨论】：

【解决方案2】：

我总是将 CSS 图像放在 CSS 文件夹的子文件夹中。例如

/resources/css/style.css
/resources/css/images/example.jpg

这样你最终会喜欢

.someId { background-image:url(images/example.jpg); }

是的，它们是相对于 CSS 文件本身的 URL 进行解析的，而不是相对于 JSF/HTML 主页面。

【讨论】：

BalusC，我知道这条评论没有添加任何有用的反馈，但我不得不说。你真是个天才。
@arg20: 谢谢 :) 相关答案顺便说一句：stackoverflow.com/questions/6835499/…

【解决方案3】：

您可以使用表达式语言 (EL) 和 FacesContext 来解决此问题。我经常使用这种技术。

background-image: url('#{facesContext.externalContext.requestContextPath}/resources/images/background.gif');

这允许您利用 JSF 根据应用程序输入或更改提供动态内容。

此技术适用于 JSF 1.2 和 JSF 2.0

【讨论】：

【解决方案4】：

@Bozho 的回答几乎涵盖了您的选择。

另一种可能性是继续使用静态样式表，并在您可以访问表达式的文档头部填写动态部分：

<head>

<!-- The style sheet contains 99% of the CSS ->
<link rel="stylesheet" href="static.css" type="text/css">

<!-- The remaining 1% is done here -->
<style type="text/css">
 .someClass { --- your dynamic values  here --- }
</style>

</head>

在 PHP 世界中，这是最佳实践，因为它避免了为样式表调用创建昂贵的 PHP 进程。我不知道 JSP 世界的情况如何，但我认为它是相似的。

【讨论】：

【解决方案5】：

不，你不能。您有多种选择：

硬编码绝对路径（当然是域相对路径）- 没那么糟糕
使用相对路径 - 当你有像/view/external/foo/bar.jsf 这样的嵌套 url 时可能会出现问题
在构建期间对它们进行预处理以设置正确的路径
使用Filter（以及客户端和服务器端缓存）设置正确的路径。

（我觉得我错过了什么）

【讨论】：

自定义资源处理程序怎么样？
请看我今天发布的答案。它被插入到顶部的某个地方，这让我有点困惑 o_O

【解决方案6】：

@博卓： JSF 允许定义一个 ResourceHandler 来替换标准的。您可以只继承 javax.faces.application.ResourceHandler，处理特定请求并将其他请求委托给基类。

对于给定的示例，自定义资源处理程序应确定上下文并替换绝对路径定义。这可以根据每个请求启用动态路径解析。

【讨论】：