JSF教程

JSF 第一个应用程序

要创建一个简单的 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 应用程序项目结构。
[INFO] Scanning for projects... 
[INFO] Searching repository for plugin with prefix: 'archetype'. 
[INFO]-------------------------------------------------------------
[INFO] Building Maven default Project 
[INFO]    task-segment: [archetype:create] (aggregator-style) 
[INFO]-------------------------------------------------------------
[INFO] [archetype:create {execution: default-cli}] 
[INFO] Defaulting package to group ID: com.tutorialspoint.test 
[INFO] artifact org.apache.maven.archetypes:maven-archetype-webapp:  
checking for updates from central 
[INFO]-------------------------------------------------------------
[INFO] Using following parameters for creating project  
from Old (1.x) Archetype: maven-archetype-webapp:RELEASE 
[INFO]-------------------------------------------------------------
[INFO] Parameter: groupId, Value: com.tutorialspoint.test 
[INFO] Parameter: packageName, Value: com.tutorialspoint.test 
[INFO] Parameter: package, Value: com.tutorialspoint.test 
[INFO] Parameter: artifactId, Value: helloworld 
[INFO] Parameter: basedir, Value: C:\JSF 
[INFO] Parameter: version, Value: 1.0-SNAPSHOT 
[INFO] project created from Old (1.x) Archetype in dir: 
C:\JSF\helloworld 
[INFO]-------------------------------------------------------------
[INFO] BUILD SUCCESSFUL 
[INFO]-------------------------------------------------------------
[INFO] Total time: 7 seconds 
[INFO] Finished at: Mon Nov 05 16:05:04 IST 2012 
[INFO] final Memory: 12M/84M 
[INFO]-------------------------------------------------------------
现在转到 C:/JSF 目录。您将看到创建的 Java Web 应用程序项目,名为 helloworld(在 artifactId 中指定)。 Maven 使用标准目录布局,如下面的屏幕截图所示。
Java Web 应用程序项目结构
通过上面的例子,我们可以理解以下几个关键概念。
S.No 文件夹结构和描述
1
helloworld
包含src文件夹和pom.xml
2
src/main/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 功能。
Downloading: http://repo.maven.apache.org/org/apache/maven/plugins/
maven-compiler-plugin/2.3.1/maven-compiler-plugin-2.3.1.pom
5K downloaded  (maven-compiler-plugin-2.3.1.pom)
Downloading: http://repo.maven.apache.org/org/apache/maven/plugins/
maven-compiler-plugin/2.3.1/maven-compiler-plugin-2.3.1.jar
29K downloaded  (maven-compiler-plugin-2.3.1.jar)
[INFO] Searching repository for plugin with prefix: 'eclipse'.
[INFO]------------------------------------------------------------
[INFO] Building helloworld Maven Webapp
[INFO]    task-segment: [eclipse:eclipse]
[INFO]------------------------------------------------------------
[INFO] Preparing eclipse:eclipse
[INFO] No goals needed for project-skipping
[INFO] [eclipse:eclipse {execution: default-cli}]
[INFO] Adding support for WTP version 2.0.
[INFO] Using Eclipse Workspace: null
[INFO] Adding default classpath container: org.eclipse.jdt.
launching.JRE_CONTAINER
Downloading: http://repo.maven.apache.org/
com/sun/faces/jsf-api/2.1.7/jsf-api-2.1.7.pom
12K downloaded  (jsf-api-2.1.7.pom)
Downloading: http://repo.maven.apache.org/
com/sun/faces/jsf-impl/2.1.7/jsf-impl-2.1.7.pom
10K downloaded  (jsf-impl-2.1.7.pom)
Downloading: http://repo.maven.apache.org/
com/sun/faces/jsf-api/2.1.7/jsf-api-2.1.7.jar
619K downloaded  (jsf-api-2.1.7.jar)
Downloading: http://repo.maven.apache.org/
com/sun/faces/jsf-impl/2.1.7/jsf-impl-2.1.7.jar
1916K downloaded  (jsf-impl-2.1.7.jar)
[INFO] Wrote settings to C:\JSF\helloworld\.settings\
org.eclipse.jdt.core.prefs
[INFO] Wrote Eclipse project for "helloworld" to C:\JSF\helloworld.
[INFO]
[INFO]-----------------------------------------------------------
[INFO] BUILD SUCCESSFUL
[INFO]-----------------------------------------------------------
[INFO] Total time: 6 minutes 7 seconds
[INFO] Finished at: Mon Nov 05 16:16:25 IST 2012
[INFO] final Memory: 10M/89M
[INFO]-----------------------------------------------------------

在 Eclipse 中导入项目

以下是步骤-
使用导入向导在 Eclipse 中导入项目。 转到文件→导入...→现有项目到工作区 选择 helloworld 的根目录。 保持将项目复制到工作区以进行检查。 点击完成按钮。 Eclipse 将导入并复制其工作区 C:\ → 项目 → 数据 → 工作区中的项目。 Eclipse 项目结构

在 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 as 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:\ → Projects → Data → WorkSpace → helloworld → target 文件夹下创建 helloworld.war。
[INFO] Scanning for projects...
[INFO]-----------------------------------------------------
[INFO] Building helloworld Maven Webapp
[INFO] 
[INFO] Id: com.tutorialspoint.test:helloworld:war:1.0-SNAPSHOT
[INFO] task-segment: [package]
[INFO]-----------------------------------------------------
[INFO] [resources:resources]
[INFO] Using default encoding to copy filtered resources.
[INFO] [compiler:compile]
[INFO] Nothing to compile-all classes are up to date
[INFO] [resources:testResources]
[INFO] Using default encoding to copy filtered resources.
[INFO] [compiler:testCompile]
[INFO] No sources to compile
[INFO] [surefire:test]
[INFO] Surefire report directory: 
C:\Projects\Data\WorkSpace\helloworld\target\surefire-reports
-------------------------------------------------------
 T E S T S
-------------------------------------------------------
There are no tests to run.
Results :
Tests run: 0, Failures: 0, Errors: 0, Skipped: 0
[INFO] [war:war]
[INFO] Packaging webapp
[INFO] Assembling webapp[helloworld] in
[C:\Projects\Data\WorkSpace\helloworld\target\helloworld]
[INFO] Processing war project
[INFO] Webapp assembled in[150 msecs]
[INFO] Building war: 
C:\Projects\Data\WorkSpace\helloworld\target\helloworld.war
[INFO]------------------------------------------------
[INFO] BUILD SUCCESSFUL
[INFO]------------------------------------------------
[INFO] Total time: 3 seconds
[INFO] Finished at: Mon Nov 05 16:34:46 IST 2012
[INFO] final Memory: 2M/15M
[INFO]------------------------------------------------

部署 WAR 文件

以下是步骤。
停止 tomcat 服务器。 将helloworld.war 文件复制到tomcat 安装目录→ webapps 文件夹 启动 tomcat 服务器。 查看 webapps 目录,应该有一个 helloworld 文件夹被创建。 现在helloworld.war已经成功部署在Tomcat Webserver root中了。

运行应用程序

在 Web 浏览器中输入 url: http://localhost:8080/helloworld/home.jsf 以启动应用程序。
服务器名称 (localhost) 和端口 (8080) 可能因您的 tomcat 配置而异。
JSF 申请结果
昵称: 邮箱:
Copyright © 2022 立地货 All Rights Reserved.
备案号:京ICP备14037608号-4