Esercizio - Creare un'app Web JavaServer Faces in Tomcat
È stato chiesto di creare un'applicazione Web JavaServer Faces (JSF) in grado di gestire gli invii dei moduli. Si creerà un'applicazione Web e la si distribuirà in locale in un server Tomcat.
Creare una semplice app Web JSF in Tomcat
In questo esercizio si creerà un progetto Maven per l'applicazione Web Java. Dopo aver creato il progetto, è necessario impostare tre configurazioni. Con la prima si aggiungono le librerie di dipendenze al file pom.xml. Con la seconda si crea un file di configurazione CDI come beans.xml per usare il CDI (Contexts and Dependency Injection). Con la terza si configura JSF nel file web.xml. Dopo le configurazioni, è possibile creare una pagina Web JSF e la classe Backing Bean per l'operazione back-end lato server. Infine si eseguirà la valutazione nell'ambiente Tomcat locale.
Creare un progetto Maven
Eseguire il comando archetype di Maven seguente. Questo comando creerà un progetto Maven per l'applicazione Web Java.
mvn archetype:generate \
-DgroupId=com.microsoft.azure.samples \
-DartifactId=azure-javaweb-app \
-DarchetypeArtifactId=maven-archetype-webapp \
-Dversion=1.0-SNAPSHOT \
-DinteractiveMode=false
Verrà visualizzato l'output seguente:
[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] ------------------------------------------------------------------------
Sono ora disponibili i file e le directory seguenti.
├── pom.xml
└── src
└── main
├── resources
└── webapp
├── WEB-INF
│ └── web.xml
└── index.jsp
Modificare il file pom.xml di Maven
Per usare le librerie JSF, è necessario aggiungere le librerie di dipendenze seguenti in pom.xml.
Sostituire il contenuto del file pom.xml con il codice seguente:
<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>
Per usare Java SE 11 invece di Java 8, modificare la voce pom.xml seguente:
<maven.compiler.source>11</maven.compiler.source>
<maven.compiler.target>11</maven.compiler.target>
Abilitare CDI (Contexts and Dependency Injection)
Rendere ora disponibile CDI per l'applicazione Web. Creare un file beans.xml nella directory src/main/WEB-INF e descrivere il contenuto seguente:
<?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>
Abilitare JSF
Per riconoscere tutti i file con l'estensione xhtml come JSF Facelets, apportare ora le modifiche seguenti a web.xml nella directory WEB-INF.
<?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>
Modificare il nome di index.jsp
Ora che le impostazioni dell'ambiente per l'esecuzione di JSF sono state completate, è possibile creare la pagina JSF. Le pagine Web JSF sono scritte nel formato di file XHTML invece che JSP, come indicato in web.xml nell'esempio precedente. Modificare quindi il nome del file index.jsp generato automaticamente al momento della creazione del progetto index.xhtml.
mv index.jsp index.xhtml
Creare una pagina Web di base per JSF
Eliminare tutto il contenuto descritto nel file index.xhtml e copiare il codice seguente:
<?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>
Creare un JSF Backing Bean
Creare ora una classe Backing Bean per implementare l'elaborazione back-end lato server. Creare una nuova directory per il pacchetto Java, che si userà per creare la classe Backing Bean nella directory src/main.
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
Creare quindi un file IndexController.java e copiare e incollare il codice JSF Backing Bean seguente:
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++;
}
}
L'ultima azione completa il programma. La struttura di directory dopo l'implementazione del programma è la seguente:
├── pom.xml
└── src
└── main
├── java
│ └── com
│ └── microsoft
│ └── azure
│ └── samples
│ └── IndexController.java
├── resources
└── webapp
├── WEB-INF
│ ├── beans.xml
│ └── web.xml
└── index.xhtml
Esecuzione nell'ambiente Tomcat locale
Se è stato installato Tomcat 9.0.x nell'ambiente locale, andare al passaggio successivo. In caso contrario, andare alla sezione successiva.
Compilare il codice sorgente ed eseguirlo in un ambiente Tomcat installato in locale. Eseguire il comando seguente.
Compilare il progetto Java e creare il pacchetto
Eseguire il comando seguente per compilare il codice:
mvn clean package
Copiare l'artefatto nella directory di distribuzione in Tomcat
Copiare il file WAR dell'artefatto nella directory in Tomcat"
cp target/azure-javaweb-app.war /$INSTALL_DIR/apache-tomcat-9.0.39/webapps/
Avviare il server Tomcat
Avviare il server Tomcat.
$INSTALL_DIR/apache-tomcat-9.0.39/bin/startup.sh
Dopo aver avviato Tomcat, passare a http://localhost:8080/azure-javaweb-app/ per visualizzare la schermata seguente:
L'applicazione Web JSF è stata eseguita correttamente nell'ambiente Tomcat locale.