Enable Security in a Fusion Web Application

You can easily install the schema and connect to the database, and then create an application and projects in which to organize your application files. Then work in JDeveloper's IDE to create the business services for your application.

Install the Schema: Download the schema zip file from OTN and install it. The cue cards use tables that are part of the Fusion Order Demo (FOD) schema.

Create a New Application: Use the Create Application wizard to create an application and projects for the EJB Components model and the user interface portions of the application.

Create a Database Connection: Use the Create Database Connection dialog to create a connection to the schema.

Create Oracle ADF Business Components: Use the Create Entities from Tables wizard to create the model layer for the application.

Create a Task Flow: Use the diagrammer, Component Palette and Property Inspector to create an ADF task flow.

Create a Page Template: Use the Create JSF Page Template dialog to begin creating a template for all the pages in the application.

Create JSF Pages: Use the Create JSF Page dialog to create the starter pages for the application.

Enable ADF Security: Use the Configure ADF Security wizard to enable security in the application.

Define Users and Roles: Use the jazn-data.xml overview editor to define application roles and users.

Define ADF Security Policies: Use the ADF Policies page in the editor to define security policies for the application.

Add a Login Link and User Information: Use the Expression Builder to add login links to the page.

Hide Menu Items and Page Components: Add conditional logic to the application, and test run it.

 

Install the Schema

tell me more icon Installing the Schema

The steps and examples in the cue cards are based on tables that are part of the Fusion Order Demo (FOD) schema. This schema is also used as the database for the sample application that ships with Oracle JDeveloper 11g, as well as other collateral in this release. It will be convenient to have this schema installed, and you only need to do it once. If you have already installed the FOD schema, you can skip this step and go directly to the next card.   [ tell me more...]





  1. go to OTN Download the schema zip file from OTN. If you created the schema previously, go to the cue cards icon next cue card.
  2. Unzip the file to a convenient location (for example, c:\temp).
  3. From the File menu, choose Open . Open the workspace c:\temp\Infrastructure\Infrastructure.jws.
  4. If you are prompted to migrate the project, click Yes to confirm, then click OK.
  5. In the Application Navigator, expand the MasterBuildScript project. Under Resources double-click build.properties to open it in the editor.
  6. Set the appropriate values in the build.properties file ( jdeveloper.home, and all the jdbc.* and db.* settings). Keep all other properties set to their default values. The demo user must be named FOD.
    The relevant settings are:
    jdeveloper.home             The /jdeveloper directory where you have JDeveloper installed, for example, c:/JDeveloper_11/jdeveloper/
    jdbc.urlBase                    Base URL for your database, for example, jdbc:oracle:thin:@localhost
    jdbc.port                         Port number for your database, for example, 1521
    jdbc.sid                           Database System Identifier, for example, XE or ORCL
    db.adminUser                  Database user with admin privileges, for example, system
    db.demoUser.tablespace  Tablespace name where the FOD user will be installed, for example, USERS
  7. In the MasterBuildScript project, select the build.xml file.
  8. In the Structure window, right-click the refreshSchema target and choose Run Target "refreshSchema" .
  9. When prompted, enter the password for the database user with admin privileges.

    tell me more icon In the IDE

    After running the Ant task, you should see a build successful message in the JDeveloper Log window.   [ tell me more...]



 

Create a New Application

tell me more icon Creating a New Application

The JDeveloper application is the highest level in the organizational structure. It stores information about the objects you are working with, while you are creating your application. It keeps track of your projects and the environment settings while you are developing.   [ tell me more...]





  1. Open the Create Application wizard [ File > New > General > Applications > Application] .
  2. Enter the application name SecureApplication to follow along with the example.
  3. In the A pplication Package Prefix field, enter oracle.
  4. Select Fusion Web Application (ADF) from the Applica tion Template list, and click Finish .

    tell me more icon Application Templates

    Application templates provide you with a quick way to create the project structure for standard applications with the appropriate combination of technologies already specified. The new application created from the template appears in the Application Navigator already partitioned into tiered projects, with the associated technology scopes set in each project.   [ tell me more...]



  5. In the Application Navigator, expand the Application Resources panel to see where resources for this application are displayed.

    tell me more icon In the IDE

    The application template that you used for your application partitions your application into two projects: Model and ViewController. In the Application Navigator, projects are displayed as the top level in the hierarchy. The Application Navigator should now look like this:   [ tell me more...]



 

Create a Database Connection

tell me more icon Creating a Database Connection

You can connect to any database for which you have connection details, or install the sample schema used in the cue card examples and then establish a connection to it. If you installed the sample schema, you will be able to follow the steps in the cue cards exactly as written. If you work with your own database, you can supply your own values as needed.   [ tell me more...]





  1. Open the Create Database Connection dialog [ File > New > General > Connections > Database Connection] .
  2. Select Application Resources if it is not selected as the Create Connection In option.
  3. Enter a name for the connection, select the connection type, and enter the username and password. To follow along with this example, use FOD for the connection name and  fod for the username.
  4. Click Test Connection to confirm that you can connect.
  5. Click OK if the connection was successful.
  6. In the Application Navigator, expand the Connections and Database nodes in the Application Resources panel to see the database objects.

    tell me more icon In the IDE

    The database connection is now included as a resource for your application.   [ tell me more...]



 

Create Oracle ADF Business Components

tell me more icon Creating Oracle ADF Business Components

Oracle ADF Business Components is a model layer technology in the Oracle Application Development Framework (Oracle ADF). Oracle ADF Business Components is a fully-featured, XML-based framework for creating business services. That is, it governs interaction between the rest of the application and the data stored in the data source, providing validation, specific services, and other business logic.  [ tell me more...]





  1. In the Application Navigator, select the Model project and launch the Create Business Components from Tables wizard [ File > New > Business Tier > ADF Business Components > Business Components from Tables] .
  2. In the Initialize Business Components Project dialog which opens before the wizard, confirm that the database connection you created (for example, FOD) is the current selection and click OK.
  3. On step 1 of the Business Components from Tables wizard, Entity Objects, click Query to populate the A vailable list.
  4. Select two tables: PRODUCTS_BASE and WAREHOUSE_STOCK_LEVELS, from the A vailable list and shuttle shuttle them to the Selec ted list to create default business components based on them. Then click Next .
  5. On step 2, Updatable View Objects, select both entity objects from the A vailable list and shuttle shuttle them to the Selec ted list. Then click Next .
  6. Click Next to skip step 3, Read-Only View Objects, which aren't needed.
  7. On step 4, Application Module, change the application module name to ProductsModule. Then click Finish .

    tell me more icon ADF Business Components

    The Create Business Components from Tables wizard does not create a user interface, nor does it determine other application logic such as control flow. It just provides a representation of, and access to, data, and implements business logic.  [ tell me more...]



  8. Click save Save All to save your work.

    tell me more icon In the IDE

    After completing the Create Business Components from Tables wizard, the Model project in the Application Navigator should look like this:  [ tell me more...]



 

Create a Task Flow

tell me more icon Creating a Task Flow

An ADF task flow includes the view activities and control flow rules that define an application's page flow. There are two types of task flows: bounded and unbounded. A bounded task flow has a single entry point and zero or more exit points; it contains its own set of private control flow rules, activities, and managed beans. An unbounded task flow is for top-level application flows; it consists of all activities and control flows in an application that are not included within any bounded task flow. A typical application is a combination of an unbounded and one or more bounded task flows.   [ tell me more...]





  1. In the Application Navigator, expand the ViewController project, Web Content and Page Flows folders, and double-click adfc-config.xml to open it in the diagrammer.

    tell me more icon ADF Task Flows and Page Flows

    By using a task flow diagram you can plan out the pages in your application and define the navigation rules for users to navigate between the pages.   [ tell me more...]



  2. In the Component Palette, ADF Task Flow page, Components panel, Control Flow section, click wildcard page icon Wildcard Control Flow Rule then drag and drop it on the diagram to add a control flow case icon.
  3. In the Components panel, Activities section, click jsf page icon View then drag and drop it on the diagram to add a view activity to represent your first application page. Change the view name to welcome.
  4. Drag and drop two additional jsf page icon View components on the diagram to add the second and third view activities. Change the view names to products and stock.
  5. In the Component Palette, Control Flow section, click navigation case icon Control Flow Case. Then in the diagram, click on the wildcard control flow rule icon and then the welcome view icon. Enter welcome for the outcome label.
  6. Click navigation case icon Control Flow Case again. Then in the diagram, click on the wildcard control flow rule icon and then the products view icon. Enter products for the outcome label.
  7. Click navigation case icon Control Flow Case again. Then in the diagram, click on the wildcard control flow rule icon and then the stock view icon. Enter stock for the outcome label.

    tell me more icon In the IDE

    The task flow contains three view activities: welcome, products and stock, and three control flow cases. The first activity you dropped is the default, as indicated by the green halo or circle. Currently the task flow does not do anything: the ! icon on each view activity indicates that the view activity is not bound to any page. Later you will tie a page to each view activity, and add navigation.   [ tell me more...]



 

Create a Page Template

tell me more icon Creating a Page Template

In this card, you will create an initial page template with the layout and components that are common to all pages in your application. Typically you would create and bind navigation components on a JSF page template, then use the template to create your pages. Using a page template also provides the same layout and look and feel for your application pages.  [ tell me more...]





  1. In the Application Navigator, select the ViewController project and open the Create JSF Page Template dialog [ File > New > Web Tier > JSF > JSF Page Template] .
  2. Enter productTemplate.jspx in the File Name field.
  3. Select Use a Quick Start Layout . Then click B rowse .
  4. In the Component Gallery, select the Two Column category, the fourth type, and the sixth layout, Two Column Left, Header (Scrolled) with locks in the top and left facets and no stretching. Then click OK.

    tell me more icon Quick Start Layout

    ADF Faces provides a number of components that you can use to define the overall template layout of the page. JDeveloper includes pre-defined page layouts that use these layout components to provide you with a quick and easy way to correctly determine the template layout.  [ tell me more...]



  5. With the Facet Definitions tab in front, click add green plus icon to add a facet. Enter main_content in the Name field. Then click OK.
  6. In the Component Palette, ADF Faces page, Layout panel, drag panel group layout icon Panel Group Layout and drop it on the top facet of the template, in the visual editor.

    tell me more icon Designing the User Interface

    To create the user interface, you add ADF Faces components to your pages.   [ tell me more...]



  7. In the Property Inspector, Common section, select vertical from the Layout dropdown list. Expand the Style and Theme section, select the Background tab, and select Black from the Color dropdown list.
  8. In the Component Palette, Common Components panel, drag and drop out put texticon Output Text into the panel group layout you just added.
  9. In the Property Inspector, enter Product Information as the Value. Expand the Style section, select the Text tab, and select White from the Color dropdown list, medium from the Size dropdown list, and bold from the Bold dropdown list.
  10. In the Component Palette, ADF Faces page, Layout panel, drag panel group layout icon Panel Group Layout and drop it on the start facet of the template.
  11. In the Property Inspector, Common section, select vertical from the Layout dropdown list. Expand the Style section, select the Background tab, and select ActiveBorder from the Color dropdown list.
  12. In the Component Palette, drag and drop link icon Link into the panel group layout in the start facet. In the Property Inspector, enter welcome as the Text and the Action property fields.
  13. Drop two additional link icon Link components into the panel group layout in the start facet. Enter products as the Text and Action property of the first, and stock as the Text and Action property of the second link.
  14. In the visual editor, click the blank area next to the start facet, below the top facet. (Above the editor tabs in the editor crumbs, you should see that you have selected the panel group layout within the center facet.)
  15. In the Component Palette, Common Components panel, drag and drop facet icon Facet Ref into the panel group layout in the center facet, where you will add the custom content for each page. Choose main_content from the dropdown list. Click OK.
  16. Click save all icon Save All to save your work.

    tell me more icon In the IDE

    When you complete the steps, the page template should look similar to this in the visual editor:  [ tell me more...]



 

Create JSF Pages

tell me more icon Creating a JSF Page

The JSF pages you create for a web application using ADF Faces are JSP documents (which have the file extension .jspx).  [ tell me more...]





  1. Click the adfc-config.xml tab to bring the diagram to the front, then double-click the welcome view icon to open the Create JSF Page dialog.
  2. Accept the file name welcome.jspx. Under Initial Page Layout and Content, select Page Template . Then select productTemplate and click OK.
  3. In the Component Palette, expand the Common Components panel. Drag output formatted Output Formatted and drop it into the main_content facet on the page.
  4. In the Property Inspector, select Expression Builder from the Value context menu. Enter the following in the Expression field and click OK:
    <p> Please log in to get started. Valid users are:</p><ul><li><b>dfaviet</b> (customer)</li><li><b>sking</b> (staff)</li><li><b>achen</b> (supplier)</li></ul> <p>The password for all users is welcome1.</p>
  5. Click the adfc-config.xml tab to bring the diagram to the front, then double-click the products view icon to open the Create JSF Page dialog. Under Initial Page Layout and Content, select Page Template . Then select productTemplate and click OK.
  6. In the Application Navigator, expand the Data Controls panel and the ProductsModuleDataControl node. Drag and drop the ProductsBaseView1 node onto the main_content facet in the visual editor.

    tell me more icon Creating a Browse Page

    The role of the browse page is to allow the user to view and navigate the data objects, one at a time. You will add databound components to the products.jspx page to create a read-only form. At runtime, the products are shown one at a time.  [ tell me more...]



  7. From the Create context menu, choose Form then choose ADF Re ad-only Form .
  8. In the Edit Form Fields dialog, select all the fields except the following: ProductName, ProductStatus, ListPrice, and CostPrice. Then click delete Delete.
  9. Select I nclude Navigation Controls , and click OK.
  10. Click the adfc-config.xml tab to bring the diagram to the front, then double-click the stock view icon to open the Create JSF Page dialog. Under Initial Page Layout and Content, select Page Template . Then select productTemplate and click OK.
  11. From the Data Controls panel, drag and drop the ProductsBaseView1 node onto the main_content facet in the visual editor. From the Create context menu, choose Navigation then choose ADF N avigation List . Select ProductName as the display attribute and click OK.
  12. In the Data Controls panel, expand ProductsBaseView1, scroll down, and select WarehouseStockLevelsView2. Drag it into the Panel Header - Details box on the page and select Graph from the Create menu.
  13. In the Component Gallery, select Bar, and click OK.

    tell me more icon Adding a Graph to the Page

    Graph is one of many data visualization components available in JDeveloper. In addition to Graph, data visualization components include Gauge, Gantt chart, Geographic Map, and Pivot Table. You can choose the type of graph you want to create from the Component Gallery.   [ tell me more...]



  14. In the Create Bar Graph dialog, drag QuantityOnHand from the A vailable list to the B ars field. Drag WarehouseId from the A vailable list to the X Axis field. Then click OK.
  15. Click save all Save All to save your work.
  16. In the editor window, click the adfc-config.xml tab to bring the diagram forward. Right-click the welcome page icon and choose R un .

    tell me more icon In the IDE

    The stock.jspx page, the last page you updated, should look similar to this page in the visual editor:  [ tell me more...]



 

Enable ADF Security

tell me more icon Enabling ADF Security

In this section you enable ADF security for your application. To begin configuring security, you will use the Configure ADF Security Wizard. To open the wizard, from the Application menu, choose Secure then choose Configure ADF Security .   [ tell me more...]





  1. Open the Configure ADF Security wizard [ Application > Secure > Configure ADF Security] .
  2. On Step 1, select ADF Authentication and Authorization, then click Next .

    tell me more icon Authentication and Authorization

    Adding authentication means that users must be authenticated (usually by a login form) before they can access the application. Authorization determines which parts of an application users can access once they are in the application.   [ tell me more...]



  3. On Step 2, select F orm-Based Authentication and Generate Default Pages . Then click Next .
  4. Click Next to accept the defaults in the remaining step, then click Finish . Click OK in the message prompt.

    tell me more icon In the IDE

    After you run the Configure ADF Security wizard with the default ADF Authentication and Authorization option selected in the ADF Security page, you will have:  [ tell me more...]



 

Define Users and Roles

tell me more icon Defining Users and Roles

In ADF security, as in Java EE security, users are assigned one or more roles, and permissions are granted to roles.  [ tell me more...]





  1. From the Application menu, choose Secure then choose Application Roles .
  2. In the Application Roles page of the overview editor for jazn-data.xml, click add green plus icon to the right of Roles three times to add three application roles. Enter customer, staff and supplier as the names of the three new roles.

    tell me more icon Application and Enterprise Roles

    In the jazn-data.xml overview editor you can create both application and enterprise roles.   [ tell me more...]



  3. Click the Users tab, then click add green plus icon to the right of Users to add a new user. Enter dfaviet as the name and welcome1 as the password. Click add green plus icon to the right of Assigned Roles and choose Assign Application Role. Select customer from the Select Roles dialog and click OK.
  4. Click add green plus icon to the right of Users again. Enter sking as the name and welcome1 as the password. Click add green plus icon to the right of Assigned Roles and choose Assign Application Role. Select staff from the Select Role dialog and click OK.
  5. Repeat the previous step to create a third user. Enter achen as the name and welcome1 as the password. Select supplier as the application role.

    tell me more icon In the IDE

    The Users page of the jazn-data.xml overview editor should now look like this:   [ tell me more...]



 

Define ADF Security Policies

tell me more icon Defining ADF Security Policies

A security policy is an access right that you define to allow users to access a resource in your application. You can define ADF security policies for web pages and task flows.   [ tell me more...]





  1. From the Application menu, choose Secure then choose ADF Policies .
  2. In the overview editor for jazn-data.xml, click the Web Pages tab.
  3. In the Page Definition list, select products, then click add green plus icon to the right of Granted to Roles. Select authenticated-role and click OK.

    tell me more icon Granting Access to Application Resources

    It is a common requirement that some web pages be available to all users, regardless of their specific access privileges. For example, the home or welcome page should be seen by all visitors to the site, while a corporate site should be available only to those who have identified themselves through authentication.  [ tell me more...]



  4. In the Page Definition list, select stock, then click add green plus icon to the right of Granted to Roles. Select supplier and click OK.

    tell me more icon In the IDE

    The ADF Security Policies page should now look like this:   [ tell me more...]



 

Add a Login Link and User Information

tell me more icon Adding a Login Link and User Information

In this step you add a link to your page template that allows users to log in and log out of your application, and text to display the name of the current user.   [ tell me more...]





  1. In the Application Navigator, expand ViewController and Web Content, and double-click productTemplate.jspx to open it in the visual editor.
  2. In the Component Palette, ADF Faces page, Layout panel, drag panel group layout icon Panel Group Layout and drop it below the Product Information title in the visual editor. In the Property Inspector, select horizontal from the Layout dropdown list.
  3. In the Component Palette, Common Components panel, drag and drop out put texticon Output Text into the panel group layout you just added.
  4. In the Property Inspector, select Expression Builder from the Rendered context menu. In the Expression builder, expand ADF Bindings and securityContext and select authenticated. Confirm that #{securityContext.authenticated} is the expression and click OK.
  5. In the Property Inspector, select Expression Builder from the Value context menu. In the Expression field, enter Welcome followed by a space. Expand ADF Bindings and securityContext and select userName. Confirm that Welcome #{securityContext.userName} is the expression and click OK.
  6. Expand the Style section, select the Text tab, and select White from the Color dropdown list, small from the Size dropdown list, and bold from the Bold dropdown list.
  7. From the Component Palette, drag and drop image icon Image to the right of the output text you just modified. (You should see the target box Panel Group Layout - horizontal.) In the Insert Image dialog, click the Source dropdown arrow (on the right) and then click Edit on the context menu. Browse to jdev_homejdeveloperideliboicons.jaroraclejavatoolsicons, select key.png then click OK. Click Yes to copy the image to your project's document root, then click Save to save it, then click OK.
  8. In the Property Inspector of the image component, select Edit from the Source context menu. Browse to jdev_homejdeveloperideliboicons.jaroraclejavatoolsicons, select listLockIcon.png and click OK, then click Yes and Save to copy the image into your project. Then enter #{securityContext.authenticated ? "/listLockIcon.png" : "/key.png"} in the Source field of the Property Inspector.

    tell me more icon Handling Login and Logout

    The conditional expression entered for the image sets the image to show a different icon depending on whether you are authenticated (logged in) or not. You selected the image source file twice to copy both image files into your project.  [ tell me more...]



  9. In the Structure window, select the af:image component you added in the previous step. From the Component Palette, drag and drop go link icon Go Link below the af:image component in the Structure window so that it appears to the right of the image in the page. In the Property Inspector, enter #{securityContext.authenticated ? "Logout" : "Login"} in the Text field. Enter the following in the Destination field:
    #{securityContext.authenticated ? "/adfAuthentication?logout=true&end_url=/faces/welcome.jspx"
    : "/adfAuthentication?success_url=/faces/products.jspx"}
  10. Expand the Style section, select the Text tab, and select White from the Color dropdown list, small from the Size dropdown list, and bold from the Bold dropdown list.
  11. In the editor window, click the adfc-config.xml tab to bring the diagram forward. Right-click the welcome page icon and choose R un .

    tell me more icon In the IDE

    The productTemplate.jspx page now looks similar to this in the visual editor:   [ tell me more...]



 

Hide Menu Items and Page Components

tell me more icon Hiding Menu Items and Page Components

In this step, you add conditional logic to hide the menu links for pages that the current user is not permitted to access. You also use conditional logic to hide the Cost Price field in the products.jspx page, so that only staff can view that field.   [ tell me more...]





  1. Click the products.jspx tab to bring the page to the front in the editor window, and select the label for the Cost Price field.
  2. In the Property Inspector, confirm that the Panel Label and Message component is shown, then select Expression Builder from the Rendered context menu. Enter #{securityContext.userInRole['staff']} in the Expression field and click OK.
  3. In the editor window, click the productTemplate.jspx tab to bring the page to the front, and select the products link on the left.
  4. In the Property Inspector, select Expression Builder from the Rendered context menu. Enter #{securityContext.authenticated} in the Expression field and click OK.

    tell me more icon Using Expressions for Rendered Properties

    Menu items and page components are hidden in this application through the use of the following three expressions:   [ tell me more...]



  5. Select the stock link in the page, and select Expression Builder from the Rendered context menu. Enter #{securityContext.regionViewable['oracle.view.pageDefs.stockPageDef']} in the Expression field and click OK.
  6. In the editor window, click the adfc-config.xml tab to bring the diagram forward. Right-click the welcome page icon and choose R un .

    tell me more icon In the IDE

    The welcome.jspx page should now look like this in your browser before you log in:   [ tell me more...]



 



Copyright © 1997, 2009, Oracle. All rights reserved.

false ,,,,,,,,,,,,,,,