Cvičení – vytvoření webové aplikace JavaServer Faces na webovém serveru Tomcat
Požádali vás o vytvoření webové aplikace JavaServer Faces (JSF), která zvládne odeslat formulář. Vytvoříte webovou aplikaci a nasadíte ji místně na server Tomcat.
Vytvoření jednoduché webové aplikace JSF na serveru Tomcat
V tomto cvičení vytvoříte projekt Maven pro webovou aplikaci v jazyce Java. Po vytvoření projektu potřebujete nakonfigurovat tři věci. Za prvé potřebujete do souboru pom.xml přidat knihovny závislostí. Za druhé potřebujete vytvořit konfigurační soubor CDI jako soubor beans.xml pro použití CDI Za třetí je to konfigurace JSF v souboru web.xml. Po této konfiguraci můžete vytvořit webovou stránku JSF a třídu backing bean pro back-endovou operaci na straně serveru. Nakonec ji vyhodnotíte v prostředí místního serveru Tomcat.
Vytvoření projektu Maven
Proveďte následující příkaz archetypu Maven. Tento příkaz vytvoří projekt Maven pro webovou aplikaci Java.
mvn archetype:generate \
-DgroupId=com.microsoft.azure.samples \
-DartifactId=azure-javaweb-app \
-DarchetypeArtifactId=maven-archetype-webapp \
-Dversion=1.0-SNAPSHOT \
-DinteractiveMode=false
Měl by se zobrazit následující výstup:
[INFO] Parameter: package, Value: com.microsoft.azure.samples
[INFO] Parameter: groupId, Value: com.microsoft.azure.samples
[INFO] Parameter: artifactId, Value: azure-javaweb-app
[INFO] Parameter: packageName, Value: com.microsoft.azure.samples
[INFO] Parameter: version, Value: 1.0-SNAPSHOT
[INFO] project created from Old (1.x) Archetype in dir: /private/tmp/TMP/azure-javaweb-app
[INFO] ------------------------------------------------------------------------
[INFO] BUILD SUCCESS
[INFO] ------------------------------------------------------------------------
[INFO] Total time: 5.416 s
[INFO] Finished at: 2020-11-02T11:12:58+09:00
[INFO] ------------------------------------------------------------------------
K dispozici jsou následující soubory a adresáře.
├── pom.xml
└── src
└── main
├── resources
└── webapp
├── WEB-INF
│ └── web.xml
└── index.jsp
Úprava souboru pom.xml Mavenu
Pokud chcete použít knihovny JSF, potřebujete do souboru pom.xml přidat následující závislé knihovny.
Obsah souboru pom.xml nahraďte následujícím kódem:
<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/maven-v4_0_0.xsd">
<modelVersion>4.0.0</modelVersion>
<groupId>com.microsoft.azure.samples</groupId>
<artifactId>azure-javaweb-app</artifactId>
<packaging>war</packaging>
<version>1.0-SNAPSHOT</version>
<name>azure-javaweb-app Maven Webapp</name>
<url>http://maven.apache.org</url>
<properties>
<maven.compiler.source>8</maven.compiler.source>
<maven.compiler.target>8</maven.compiler.target>
<failOnMissingWebXml>false</failOnMissingWebXml>
<project.build.sourceEncoding>UTF-8</project.build.sourceEncoding>
<project.reporting.outputEncoding>UTF-8</project.reporting.outputEncoding>
</properties>
<dependencies>
<dependency>
<groupId>javax.servlet</groupId>
<artifactId>javax.servlet-api</artifactId>
<version>4.0.1</version>
<scope>provided</scope>
</dependency>
<dependency>
<groupId>org.glassfish</groupId>
<artifactId>javax.faces</artifactId>
<version>2.4.0</version>
</dependency>
<dependency>
<groupId>org.primefaces</groupId>
<artifactId>primefaces</artifactId>
<version>8.0</version>
</dependency>
<dependency>
<groupId>org.jboss.weld.servlet</groupId>
<artifactId>weld-servlet</artifactId>
<version>2.4.8.Final</version>
</dependency>
<dependency>
<groupId>org.projectlombok</groupId>
<artifactId>lombok</artifactId>
<version>1.18.12</version>
<scope>provided</scope>
</dependency>
<dependency>
<groupId>junit</groupId>
<artifactId>junit</artifactId>
<version>4.12</version>
<scope>test</scope>
</dependency>
<dependency>
<groupId>org.mockito</groupId>
<artifactId>mockito-core</artifactId>
<version>2.23.0</version>
<scope>test</scope>
</dependency>
</dependencies>
<build>
<finalName>azure-javaweb-app</finalName>
</build>
</project>
Pokud chcete místo verze Java 8 použít verzi Java SE 11, změňte v souboru pom.xml následující záznam:
<maven.compiler.source>11</maven.compiler.source>
<maven.compiler.target>11</maven.compiler.target>
Povolení injektáže kontextu a závislostí
Dále povolíte ve webové aplikaci injektáž kontextu a závislostí (CDI). V adresáři src/main/WEB-INF vytvořte soubor beans.xml a popište následující obsah:
<?xml version="1.0" encoding="UTF-8"?>
<beans xmlns="http://xmlns.jcp.org/xml/ns/javaee"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee http://xmlns.jcp.org/xml/ns/javaee/beans_1_1.xsd"
bean-discovery-mode="all">
</beans>
Povolení JSF
Dále je potřeba rozpoznat všechny soubory s příponou xhtml jako JSF Facelets. V souboru web.xml v adresáři WEB-INF proveďte následující změny.
<?xml version="1.0" encoding="UTF-8"?>
<web-app version="4.0" xmlns="http://xmlns.jcp.org/xml/ns/javaee" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee http://xmlns.jcp.org/xml/ns/javaee/web-app_4_0.xsd">
<servlet>
<servlet-name>Faces Servlet</servlet-name>
<servlet-class>javax.faces.webapp.FacesServlet</servlet-class>
<load-on-startup>1</load-on-startup>
</servlet>
<context-param>
<param-name>primefaces.THEME</param-name>
<param-value>nova-light</param-value>
</context-param>
<servlet-mapping>
<servlet-name>Faces Servlet</servlet-name>
<url-pattern>*.xhtml</url-pattern>
</servlet-mapping>
<welcome-file-list>
<welcome-file>index.xhtml</welcome-file>
</welcome-file-list>
</web-app>
Změna názvu souboru index.jsp
Když máte nastavené prostředí pro běh JSF, je čas vytvořit stránku JSF. Webové stránky JSF jsou napsané ve formátu souboru XHTML místo JSP (viz předchozí příklad web.xml). Změňte proto název souboru index.jsp, automaticky vygenerovaného při vytvoření projektu na index.xhtml.
mv index.jsp index.xhtml
Vytvoření základní webové stránky pro JSF
Odstraňte veškerý obsah napsaný v souboru index.xhtml a zkopírujte do něj následující kód:
<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:h="http://xmlns.jcp.org/jsf/html" xmlns:p="http://primefaces.org/ui">
<h:head>
<title>Input Value Counter Sample</title>
</h:head>
<h:body>
<h:form>
<p:outputLabel value="Basic" /><br />
<p:inputText value="#{indexcontroller.inputValue}" /><br />
<p:commandButton update="ajaxUpdateText" value="Submit" action="#{indexcontroller.submitButtonAction()}" />
<br />
<p:outputLabel id="ajaxUpdateText" value="Input Value: #{indexcontroller.inputValue}" /><br />
</h:form>
</h:body>
</html>
Vytvoření třídy backing bean specifikace JSF
Dále vytvořte třídu backing bean, která implementuje zpracování back-endem na straně serveru. Vytvořte nový adresář pro balíček Java, který použijete k vytvoření backing bean v src/main adresáři.
mkdir src/main/java
mkdir src/main/java/com
mkdir src/main/java/com/microsoft
mkdir src/main/java/com/microsoft/azure
mkdir src/main/java/com/microsoft/azure/samples
Pak vytvořte soubor IndexController.java a zkopírujte do něj následující kód JSF backing bean.
package com.microsoft.azure.samples;
import java.io.Serializable;
import javax.faces.view.ViewScoped;
import javax.inject.Named;
import lombok.Getter;
import lombok.Setter;
@Named("indexcontroller")
@ViewScoped
public class IndexController implements Serializable{
private static final long serialVersionUID = 8485377386286855408L;
@Setter @Getter
private String inputValue;
private int counter;
public void submitButtonAction(){
inputValue = inputValue + " : " + counter;
counter++;
}
}
Toto je poslední akce, kterou program dokončíte. Po implementaci programu vypadá adresářová struktura takto:
├── pom.xml
└── src
└── main
├── java
│ └── com
│ └── microsoft
│ └── azure
│ └── samples
│ └── IndexController.java
├── resources
└── webapp
├── WEB-INF
│ ├── beans.xml
│ └── web.xml
└── index.xhtml
Spuštění v místním prostředí Tomcat
Pokud máte ve svém místním prostředí nainstalovaný Tomcat 9.0.x, pokračujte dalším krokem. Jinak přejděte k dalšímu oddílu.
Zkompilujte zdrojový kód a spusťte ho v lokálně nainstalovaném prostředí Tomcat. Proveďte následující příkaz:
Kompilace a zabalení projektu v jazyce Java
Spuštěním následujícího příkazu zkompilujte kód:
mvn clean package
Zkopírování artefaktu do adresáře pro nasazení na serveru Tomcat
Zkopírujte soubor war artefaktu do adresáře v Tomcatu.
cp target/azure-javaweb-app.war /$INSTALL_DIR/apache-tomcat-9.0.39/webapps/
Spuštění serveru Tomcat
Spusťte server Tomcat.
$INSTALL_DIR/apache-tomcat-9.0.39/bin/startup.sh
Po spuštění serveru Tomcat přejděte na adresu http://localhost:8080/azure-javaweb-app/. Zobrazí se následující obrazovka:
Úspěšně jste v místním prostředí Tomcat spustili webovou aplikaci JSF.