Основы JSF

Это краткое руководство, в котором кратко рассматриваются некоторые основы JSF, как мы определяем страницы и подключаем их к объектам на стороне сервера. Вместо того, чтобы охватывать основы запуска нового приложения JSF, я собираюсь начать с одного из архетипов Knappsack, который может предоставить вам приложение JEE 6, готовое к запуску. В этом случае мы начнем с примера на основе сервлета, чтобы вы могли запустить его с помощью встроенных контейнеров сервлета.

Для создания нового проекта мы будем использовать следующие значения GAV архетипа. Вы также можете прочитать о создании нового приложения Knappsack

groupId = org.fluttercode.knappsack
artifactId=jee6-servlet-basic
version=1.0.5

Получив проект, просто запустите mvn jetty: запустите в командной строке и перейдите по адресу http: // localhost: 8080 / jsfbasics / home.jsf . Хорошо, теперь все готово, давайте посмотрим на страницу JSF и ее содержимое.

JSF использует язык шаблонов, называемый facelets. JSF 1 первоначально использовал JSP в качестве языка представления, но для JSF 2.0 Facelets стали стандартами де-факто и были приняты в качестве стандартных языков определения представления для JSF 2.0. В нашем приложении у нас есть файл шаблона с именем WEB-INF / templates / template.xhtml. Шаблон просто имеет много стандартного кода представления, но есть некоторый интерфейс: вставьте теги, которые отмечают места в шаблоне, куда мы должны вставлять контент. Например, основной контент вставляется в область лицевых сторон, которая называется контентом

<ui:insert name="content">Main Content</ui:insert>

Это точки вставки, которые используются страницами, основанными на этом шаблоне. Одной из замечательных особенностей лицевых сторон является то, что шаблон определяет точки содержимого, а сама страница используется для определения используемого шаблона, а затем помещает содержимое в точки содержимого. Это гораздо лучше, чем включать фрагменты страницы в страницу JSP, использовать декоратор страницы или использовать шаблон для включения страницы контента. Наша главная страница home.xhtml — одна из таких страниц, которая использует этот шаблон.

home.xhtml

<?xml version="1.0" encoding="UTF-8"?>
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:h="http://java.sun.com/jsf/html"
	template="/WEB-INF/templates/template.xhtml">

	<ui:define name="content">
		<h1><h:outputText value="Hello From JSF" /></h1>
	</ui:define>

</ui:composition>

 

В самом верху тега композиции мы сообщаем Facelets, что хотим использовать файл template.xhtml в качестве нашей страницы шаблона. Далее у нас есть тег ui: define, который определяет контент, который будет использоваться в шаблоне. Facelets работает, когда страница вытягивает шаблон на страницу и помещает его содержимое в слоты, предоставленные шаблоном. Это гораздо лучше, чем перетаскивать контент на главную страницу с помощью include или указывать шаблон, который используется везде, и украшать им контент. Это лучшее из обоих миров. Каждая страница определяет, какую страницу шаблона она использует, и помещает в нее содержимое.

Наш первый использованный компонент

Здесь вы можете видеть, что мы использовали наш первый компонент JSF:

<h:outputText value="Hello From JSF" />

 

Это стандартный компонент JSF, который используется для вывода текста. Мы могли бы просто написать текст прямо на странице, но цель этой страницы — проверить, работает ли конфигурация JSF, и для этого нам нужно проверить, правильно ли отображается компонент JSF. Вы можете редактировать текст в значении, и, очевидно, это изменит текст, отображаемый на странице.

Наш первый боб

Отображение статического текста — это не то, для чего были созданы веб-фреймворки, мы действительно хотим отображать что-то, что происходит из некоторого Java-кода. Для этого мы создадим компонент поддержки, который является Java-объектом, который является частью веб-приложения, о котором знает JSF. Чтобы создать базовый компонент, создайте новый класс и назовите его PageBean.

import javax.enterprise.context.RequestScoped;
import javax.inject.Named;

@Named
@RequestScoped
public class PageBean {

	private String message = "Mighty apps from little java beans grow";

	public String getMessage() {
		return message;
	}

	public void setMessage(String message) {
		this.message = message;
	}
}

Сам код довольно прост. Одно поле со значением по умолчанию и геттерами и сеттерами. Тем не менее, у нас есть пара новых аннотаций на уровне класса. Во-первых, аннотация @Named, которая сообщает CDI, что у этого компонента есть имя, которое будет использоваться для ссылки на этот компонент с помощью выражений EL. Поскольку мы не указали имя, используется имя по умолчанию для pageBean. Аннотация @RequestScope сообщает CDI, что этот bean-компонент является областью действия запроса, поэтому при создании он должен сохраняться до конца текущего запроса и затем уничтожаться. Это означает, что в следующий раз, когда мы вызовем эту страницу, этот bean-компонент будет создан заново и будет использована новая версия, которая снова будет уничтожена в конце запроса.

Теперь мы собираемся изменить наше приложение, чтобы вместо этого отображать это сообщение. С этого момента мы просто будем показывать код внутри операторов ui: define:

	<ui:define name="content">
		<h:outputText value="#{pageBean.message}" />
	</ui:define>
</ui:composition>