Могу ли я использовать EL для внешних CSS-файлов с JSF? - PullRequest
5 голосов
/ 01 мая 2011

Во внешних таблицах стилей моего текущего проекта JSF есть жестко запрограммированные ссылки на внешние ресурсы, такие как

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

В документах JSF xhtml я мог бы использовать выражения EL, такие как $ {request.contextPath}но как можно применить обработку EL к файлам CSS?

(Связано: Как я могу встроить ссылку на фоновое изображение CSS с JSF? )


Hard-недостатком кодирования путей контекста является то, что путь контекста - /context в примере - веб-приложения можно изменить во время развертывания, изменив файл web.xml (или переименовав файл архива веб-приложения, если контекст не указан вweb.xml), но ссылки на ресурсы в файлах CSS по-прежнему будут указывать на неизмененный жестко заданный контекст и приводить к ошибкам при обнаружении ресурса.

Ответы [ 6 ]

11 голосов
/ 20 июля 2011

Может быть, я неправильно понимаю ваш вопрос, но если под внешним css вы просто подразумеваете свой собственный css, который не inline , то с JSF 2.0 вы можете использовать EL в вашем css, если вы включите его в<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']}');
}
8 голосов
/ 16 мая 2011

Я помещаю изображения CSS всегда в подпапку папки CSS. Э.Г.

  • / ресурсы / CSS / style.css
  • / ресурсы / CSS / изображений / example.jpg

Таким образом, вы в конечном итоге, как

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

Да, они разрешаются относительно URL самого файла CSS, а не основной страницы JSF / HTML.

5 голосов
/ 09 августа 2011

Вы можете использовать Expression Language (EL) вместе с FacesContext для решения проблемы. Я часто использую эту технику.

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

Это позволяет вам использовать преимущества JSF для предоставления динамического содержимого на основе ввода или изменений приложения.

Этот метод работает на JSF 1.2 и JSF 2.0

3 голосов
/ 01 мая 2011

@ Ответ Божо в значительной степени охватывает ваши варианты.

Другая возможность состоит в том, чтобы продолжать иметь статическую таблицу стилей и заполнять динамические части в заголовке документа, где у вас есть доступ к выражениям:

<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, но я предполагаю, что это похоже.

2 голосов
/ 16 мая 2011

@ Божо: JSF позволяет определить ResourceHandler вместо стандартного.Вы можете просто создать подкласс javax.faces.application.ResourceHandler, обрабатывать определенные запросы и делегировать другие базовому классу.

Для данного примера обработчик пользовательских ресурсов должен определять контекст и заменять определения абсолютного пути.Это позволяет динамическое разрешение пути на основе запроса.

2 голосов
/ 01 мая 2011

Нет, вы не можете. У вас есть несколько вариантов:

  • абсолютные пути в жестком коде (относительно домена), конечно, неплохо
  • использовать относительные пути - может быть проблемой, если у вас есть вложенные URL-адреса, такие как /view/external/foo/bar.jsf
  • предварительно обработайте их во время сборки, чтобы установить правильные пути
  • используйте Filter (и кеширование на стороне клиента и на сервере) для установки правильных путей.

(я чувствую, что что-то упустил)

...