Övning – Skapa en JavaServer Faces-webbapp på Tomcat
Du har blivit ombedd att skapa en JavaServer Faces-webbapp (JSF) som kan hantera formuläröverföringar. Du skapar ett webbprogram och distribuerar det lokalt till en Tomcat-server.
Skapa en enkel JSF-webbapp på Tomcat
I den här övningen ska vi skapa ett Maven-projekt för din Java-webbapp. När du har skapat projektet måste du konfigurera tre konfigurationer. Den första är att lägga till beroendebiblioteken i pom.xml-filen. Den andra är att skapa en CDI-konfigurationsfil som beans.xml för att använda Contexts and Dependency Injection (CDI). Den tredje är att konfigurera JSF på web.xml-filen. Efter konfigurationerna kan vi skapa en JSF-webbsida och skapa backing-bean för serversidans back-end-funktion. Slutligen utvärderar vi den i den lokala Tomcat-miljön.
Skapa ett Maven-projekt
Kör följande Maven-arketypkommando. Det här kommandot skapar ett Maven-projekt för java-webbappen.
mvn archetype:generate \
-DgroupId=com.microsoft.azure.samples \
-DartifactId=azure-javaweb-app \
-DarchetypeArtifactId=maven-archetype-webapp \
-Dversion=1.0-SNAPSHOT \
-DinteractiveMode=false
Du ser följande utdata:
[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] ------------------------------------------------------------------------
Följande filer och kataloger är nu tillgängliga.
├── pom.xml
└── src
└── main
├── resources
└── webapp
├── WEB-INF
│ └── web.xml
└── index.jsp
Ändra maven-pom.xml-filen
Om du vill använda JSF-biblioteken måste vi lägga till följande beroendebibliotek i pom.xml.
Ersätt innehållet i pom.xml med följande kod:
<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>
Om du vill använda Java SE 11 i stället för Java 8 ändrar du följande pom.xml post:
<maven.compiler.source>11</maven.compiler.source>
<maven.compiler.target>11</maven.compiler.target>
Aktivera kontexter och beroendeinmatning
Gör sedan CDI tillgängligt för ditt webbprogram. Skapa en beans.xml-fil under katalogen src/main/WEB-INF och beskriv följande innehåll:
<?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>
Aktivera JSF
Om du sedan vill identifiera alla filer med xhtml-tillägget som JSF Facelets gör du följande ändringar i web.xml under katalogen 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>
Ändra namnet på index.jsp
Nu när miljöinställningarna för JSF har slutförts är det dags att skapa JSF-sidan. JSF-webbsidor skrivs i XHTML-filformat i stället för JSP, enligt web.xml i föregående exempel. Ändra därför namnet på den index.jsp fil som genererades automatiskt när projektet skapades för att index.xhtml.
mv index.jsp index.xhtml
Skapa en grundläggande webbsida för JSF
Ta bort allt innehåll som beskrivs i index.xhtml och kopiera följande kod:
<?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>
Skapa en JSF-backbean
Skapa sedan en backing bean för att implementera serverdelsbearbetning. Skapa en ny katalog för ditt Java-paket, som du ska använda för att skapa backing bean under katalogen 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
Skapa sedan en IndexController.java-fil och kopiera och klistra in JSF-backning bönkoden som följer:
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++;
}
}
Den här sista åtgärden slutför programmet. Katalogstrukturen efter att programmet har implementerats är följande:
├── pom.xml
└── src
└── main
├── java
│ └── com
│ └── microsoft
│ └── azure
│ └── samples
│ └── IndexController.java
├── resources
└── webapp
├── WEB-INF
│ ├── beans.xml
│ └── web.xml
└── index.xhtml
Att köra i en lokal Tomcat-miljö
Om du har installerat Tomcat 9.0.x i din lokala miljö går du till nästa steg. Annars går du till nästa avsnitt.
Kompilera källkoden och kör den i en lokalt installerad Tomcat-miljö. Kör följande kommando.
Kompilera och paketera Java-projektet
Kör följande kommando för att kompilera koden:
mvn clean package
Kopiera artefakten till distributionskatalogen på Tomcat
Kopiera artefaktkrigsfilen till katalogen i Tomcat"
cp target/azure-javaweb-app.war /$INSTALL_DIR/apache-tomcat-9.0.39/webapps/
Starta Tomcat-servern
Starta Tomcat-servern.
$INSTALL_DIR/apache-tomcat-9.0.39/bin/startup.sh
När du har startat Tomcat bläddrar du till http://localhost:8080/azure-javaweb-app/ så visas följande skärm:
Du har kört JSF-webbprogrammet i din lokala Tomcat-miljö.