要创建一个简单的JSF应用程序,我们将使用maven-archetype-webapp插件。在下面的示例中,我们将在C:\ JSF文件夹中创建一个基于maven的Web应用程序项目。
创建项目
我们打开命令控制台,进入C:> JSF目录,然后执行下面的mvn命令。
C:\JSF>mvn archetype:create
-DgroupId = com.tutorialspoint.test
-DartifactId = helloworld
-DarchetypeArtifactId = maven-archetype-webapp
Maven将开始处理,并将创建完整的java Web应用程序项目结构。
现在去C:/ JSF目录。您将看到一个名为helloworld(在artifactId中指定)的Java Web应用程序项目。Maven使用标准目录布局,如以下屏幕截图所示。
使用上述示例,我们可以了解以下关键概念。
S.No | 文件夹结构与说明 |
---|---|
1 | helloworld 包含src文件夹和pom.xml |
2 | src /mian/ wepapp 包含WEB-INF文件夹和index.jsp页面 |
3 | src / main /resources 它包含图像/属性文件(在上面的例子中,我们需要手动创建这个结构) |
将JSF功能添加到项目中
添加以下JSF依赖关系。
<dependencies>
<dependency>
<groupId>com.sun.faces</groupId>
<artifactId>jsf-api</artifactId>
<version>2.1.7</version>
</dependency>
<dependency>
<groupId>com.sun.faces</groupId>
<artifactId>jsf-impl</artifactId>
<version>2.1.7</version>
</dependency>
</dependencies>
POM.xml
<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.tutorialspoint.test</groupId>
<artifactId>helloworld</artifactId>
<packaging>war</packaging>
<version>1.0-SNAPSHOT</version>
<name>helloworld Maven Webapp</name>
<url>http://maven.apache.org</url>
<dependencies>
<dependency>
<groupId>junit</groupId>
<artifactId>junit</artifactId>
<version>3.8.1</version>
<scope>test</scope>
</dependency>
<dependency>
<groupId>com.sun.faces</groupId>
<artifactId>jsf-api</artifactId>
<version>2.1.7</version>
</dependency>
<dependency>
<groupId>com.sun.faces</groupId>
<artifactId>jsf-impl</artifactId>
<version>2.1.7</version>
</dependency>
</dependencies>
<build>
<finalName>helloworld</finalName>
<plugins>
<plugin>
<groupId>org.apache.maven.plugins</groupId>
<artifactId>maven-compiler-plugin</artifactId>
<version>2.3.1</version>
<configuration>
<source>1.6</source>
<target>1.6</target>
</configuration>
</plugin>
</plugins>
</build>
</project>
准备Eclipse项目
我们打开命令控制台。执行C:> JSF> helloworld目录,并执行以下mvn命令。
C:\JSF\helloworld>mvn eclipse:eclipse -Dwtpversion = 2.0
Maven将开始处理,创建eclipse就绪项目,并添加wtp功能。
在Eclipse中导入项目
以下是步骤 -
- 使用导入向导在eclipse中导入项目。
- 转到文件→导入…→现有项目进入工作区.
- 选择根目录到helloworld。
- 将复制项目保留到工作区以进行检查。
- 单击完成按钮。
- Eclipse将在其工作区C:\→项目→数据→工作台中导入和复制项目。
在web.xml中配置Faces Servlet
在webapp→WEB-INF文件夹中找到web.xml,如下所示进行更新。
<?xml version = "1.0" encoding = "UTF-8"?>
<web-app xmlns:xsi = "http://www.w3.org/2001/XMLSchema-instance"
xmlns = "http://java.sun.com/xml/ns/javaee"
xmlns:web = "http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd"
xsi:schemaLocation = "http://java.sun.com/xml/ns/javaee
http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd"
id = "WebApp_ID" version="2.5">
<welcome-file-list>
<welcome-file>faces/home.xhtml</welcome-file>
</welcome-file-list>
<!--
FacesServlet is main servlet responsible to handle all request.
It acts as central controller.
This servlet initializes the JSF components before the JSP is displayed.
-->
<servlet>
<servlet-name>Faces Servlet</servlet-name>
<servlet-class>javax.faces.webapp.FacesServlet</servlet-class>
<load-on-startup>1</load-on-startup>
</servlet>
<servlet-mapping>
<servlet-name>Faces Servlet</servlet-name>
<url-pattern>/faces/*</url-pattern>
</servlet-mapping>
<servlet-mapping>
<servlet-name>Faces Servlet</servlet-name>
<url-pattern>*.jsf</url-pattern>
</servlet-mapping>
<servlet-mapping>
<servlet-name>Faces Servlet</servlet-name>
<url-pattern>*.faces</url-pattern>
</servlet-mapping>
<servlet-mapping>
<servlet-name>Faces Servlet</servlet-name>
<url-pattern>*.xhtml</url-pattern>
</servlet-mapping>
</web-app>
创建托管Bean
在src→main→java下创建一个包结构,作为com→tutorialspoint→test。在此包中创建HelloWorld.java类。更新HelloWorld.java的代码,如下所示。
package com.tutorialspoint.test;
import javax.faces.bean.ManagedBean;
@ManagedBean(name = "helloWorld", eager = true)
public class HelloWorld {
public HelloWorld() {
System.out.println("HelloWorld started!");
}
public String getMessage() {
return "Hello World!";
}
}
创建一个JSF页面
在webapp文件夹下创建一个home.xhtml页面。更新home.xhtml的代码,如下所示。
<!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">
<head>
<title>JSF Tutorial!</title>
</head>
<body>
#{helloWorld.getMessage()}
</body>
</html>
建设项目
以下是步骤。
- 在eclipse中选择helloworld项目
- 使用运行方式向导
- 选择运行方式→Maven包
- Maven将开始构建项目,并将在C:\→项目→数据→工作台→helloworld→目标文件夹下创建helloworld.war 。
部署WAR文件
以下是步骤。
- 停止tomcat服务器。
- 将helloworld.war文件复制到tomcat安装目录→webapps文件夹。
- 启动tomcat服务器。
- 看看webapps目录,应该有一个文件夹helloworld创建
- 现在,helloworld.war已成功部署在Tomcat Webserver根目录中。
运行应用程序
在web浏览器中输入一个URL:http:// localhost:8080 / helloworld / home.jsf启动应用程序。
服务器名称(localhost)和端口(8080)可能会根据您的tomcat配置而有所不同。