Oracle Account

Manage your account and access personalized content. Sign up for an Oracle Account

Sign in to Cloud

Access your cloud dashboard, manage orders, and more. Sign up for a free trial

使用 JDeveloper 的 JavaServer Faces 简介

目的

本教程将向您介绍使用 JavaServer Faces (JSF) 构建客户端应用程序的基础知识。

所需时间:

大约 20 分钟

主题

本教程包括下列主题:

JavaServer Faces (JSF) 是用于构建 Web 应用程序的标准 Java 框架。它通过提供以组件为中心的方法开发 Java Web 用户界面来简化开发。 通过将构建良好的模型-视图-控制器 (MVC) 设计模式集成到体系结构中,JSF 还可以确保设计的应用程序具有更好的可维护性。 JavaServer Faces 真正的功能依赖于它的用户界面组件模型,其中的应用程序由组件集合构建,可以使用多种方式针对多个客户端类型呈现。

在本教程中,您将创建三个 JSF 页面。第一个页面是 Welcome 页面,该页面将充当应用程序的起点。第二个页面是 Login 页面,有两个域;一个用于用户名,一个用于口令。该页面使用 Java bean 使这两个值可用于应用程序的其他页面。第三个页面将返回一条 Hello 消息,并显示存储在辅助 Bean 中的用户名。您还将定义从 Welcome 页面到 Login 页面、再到 Hello 页面的 JSF 导航链接。

返回主题列表

开始本教程之前,您应该:

可以访问或已经安装了 Oracle JDeveloper (10.1.3.1.0)。可以从 Oracle 技术网 下载它。

返回主题列表

构建 JavaServer Faces 项目

该主题将引导您逐步创建一个使用 JavaServer Faces 的 Web 应用程序。要为 JSF 视图创建一个新的应用程序和项目,执行以下步骤:

要创建新的应用程序,在 Applications Navigator 中右键单击 Applications 节点,并选择 New Application... 选项。

在向导的 Component Binding 页面中,选择 Do Not Automatically Expose UI components in a Managed Bean 选项。单击 Next

在向导的 Tag Libraries 页面中,您将看到为该 JSP 页面启用的标记库。因为这将是一个支持 JSF 的页面,因此预先选中了 JSF Core JSF HTML 库。

选择标记库只是将必要的 JSF taglib 指令插入页面。JDeveloper 还附带有 JSF 组件的其他 ADF Faces 集。您可以通过 Tools 菜单的 Manage Libraries 选项添加其他 JSF 组件。

您只需要默认的 taglib 指令,因此单击 t 继续。

对页面应用样式表。为此,在 Component Palette 下拉列表中选择 CSS 库。(如果没有看到 Component Palette,请选择 View > Component Palette 。) JDeveloper 样式表从 Component Palette 拖到您的页面。您应该看到页面外观立即改变(如果没有,选择该页面,然后选择 View > Refresh )。

这是 JSP 标记,该标记提供了到 JSF commandButton 用户界面组件的钩子。当该标记执行时,它将提供一个可点击的按钮,该按钮可以执行诸如调用 Java 方法或执行 JSF 导航规则之类的任务。

在该示例中,该按钮将执行到另一个页面的导航。这是通过在 Property Inspector 中设置 commandButton 的 Action 属性,然后定义与动作的值相对应的导航规则来实现的。在本例中,您已经将 Action 属性的值设为 login 。稍后,您将定义一个导航规则,以使用同一个值导航到 Login 页面。

创建页面流和 Login 页面

您可以在 JSF Navigation Diagram 上控制应用程序的页面流,JSF Navigation Diagram 是 faces-config.xml 文件的直观表示。 faces-config.xml 文件是主要 JSF 应用程序配置文件,其中定义了导航规则和托管 bean。

在 JSF Navigation Diagram 可视编辑器(也称为页面流编辑器)中,您可以通过拖到图中来合并现有页面。还可以使用 Component Palette 直接在图上创建新页面。

faces-config.xml 中还定义了托管 bean,它是 JSF 的关键部分。只要包含无参数构造函数,任何 Java 对象都可以是托管 bean。在创建页面时,您可以自动创建具有您在页面上创建的对象引用的托管 bean。这种类型的托管 bean 称为辅助 bean,它还提供了放置代码的位置。在许多情况下,辅助 bean 只包含操作代码,不包含对 UI 组件的引用或者对一些您需要以编程方式操作的组件的引用。托管 bean 还可以用于保存请求、应用程序或会话的信息。在该应用程序中,您将使用托管 bean 保存用户名的值,并执行验证口令的代码。

要定义页面流并创建 Login 页面,执行以下步骤:

在 Applications Navigator( Web Content > WEB-INF 文件夹)中,找到 faces-config.xml 文件。双击该文件调用 JSF 导航编辑器。

可视编辑器将显示一个屏幕,其中显示了帮助消息。

:打开页面流编辑器的另一个方法是,右键单击 view 项目,并从上下文菜单中选择 Open JSF Navigation Overview 选项卡将显示一个控制台类型的界面,它允许您将所有类型的配置注册到 faces-config.xml 文件中,包括托管 bean、导航规则和其他项(如自定义验证器或转换器)。

  • Source 选项卡使您可以直接利用增强的 XML 编辑功能(包括标记完成)来编辑 XML。
  • History 选项卡是所有编辑器窗口通用的,它显示最近编辑的历史记录。

    为此,选择 Automatically Expose UI Components in a New Managed Bean 选项。接受 Bean 名称和类的默认值。确保将程序包命名为 view.backing 。单击 Finish

    panelGrid 将用作一个表结构来安排登录域的布局。(此外,HTML 表也可以用作登录域的容器,但 panelGrid 代码更紧凑。)

    在 Component Palette 中,确保显示了 JSF HTML Palette 页面。将 Panel Grid 组件拖到页面标题下,以调用 Create PanelGrid 向导。 hello.jsp 。该页阐释了如何使用一个辅助 bean 显示来自另一页面的信息。Hello 页面将显示用户输入 Login 页面的用户名。用户名存储在 Login 页面的辅助 bean 中。

    要构建 Hello 页面,执行以下步骤:

  • 单击编辑器中的 faces-config.xml 选项卡转到 JSF Navigation Diagram。双击图面中的 hello.jsp 以调用 Create JSF JSP 向导。

    在向导的 Component Binding 页面上,选择 Do Not Automatically Expose UI components in a Managed Bean 选项。单击 Finish OutputText ,在 Property Inspector 中选择 Value 属性,然后单击 Property Inspector 工具栏中的 Binding to Data

    通过为 User Name 域指定一个值并指定一个有效的口令字符串(长度介于 4 位和 8 位之间)来重新测试登录页面,然后单击 Proceed to Login 按钮。显示 Hello 页面,返回您的用户名。

    从 Welcome 页面到 Login 页面、再到 Hello 页面的导航成功!

    在 Structure 窗口(默认显示在 Applications Navigator 下方)中,右键单击与 Hello Me 按钮对应的 h:commandButton ,并从上下文菜单中选择 Create Method Binding for Action 选项。(如果 Structure 窗口没有出现,则选择 View > Structure 。)

    由于 Login 页面有两个导航示例,因此您可以从 commanButton 访问两个可能的目标页面。您需要根据条件以编程方式导航到 Hello 页面或 Welcome 页面。为此,返回一个与 Login 页面的一个 From Outcomes 相符的字符串: hello failed

    按如下方式更改 if 语句代码:

    if (inputSecret1.getValue().toString().equals("welcome")) { return "hello";

    } else { String message = "Invalid login"; FacesContext.getCurrentInstance().addMessage(null, new FacesMessage(message)); return "failed"; String message = "Invalid login"; FacesContext.getCurrentInstance().addMessage(null, new FacesMessage(message)); return "failed";