IBM Forms V8.0 Forms Experience Builder - Portal Integration Lab Exercise
Catalog Number Copyright IBM Corporation, 2012 US Government Users Restricted Rights - Use, duplication or disclosure restricted by GSA ADP Schedule Contract with IBM Corp.
Contents OVERVIEW...4 INTRODUCTION...4 INTEGRATION PREREQUISITES (COMPLETE IF YOU SKIPPED LAB: CREATING AN EXPENSE REPORT APPLICATION )...5 DURATION...6 INTEGRATION BETWEEN WEBSPHERE PORTAL AND FORMS EXPERIENCE BUILDER...7 1.1 INTEGRATION PREREQUISITES (COMPLETED)...7 1.2 INSTALLING THE IBM FORMS EXPERIENCE BUILDER PORTLET...14 1.3 ADDING THE FEB PORTLET TO A PORTAL PAGE...16 1.4 CONFIGURING THE FORMS EXPERIENCE BUILDER PORTLET...19 1.5 INTEGRATION WITH PORTAL USER INFORMATION...23 1.6 SUMMARY...32 ADDITIONAL RESOURCES...33 Contents Page 3
Overview This lab will show you how to configure the integration between WebSphere Portal and Forms Experience Builder, as well as how to design and configure a Forms Experience Builder application that can retrieve Portal user information. Our example scenario will be the Expense Report application which created during the previous Forms Experience Builder (Lab 2) Forms Experience Builder: Creating An Expense Report Application. NOTE: If you skipped you can login into FEB and deploy the application named Expense Report. Refer to Step 40 in this lab for importing and deployment instructions. Some of the things you will learning on this lab are: Integration Prerequisites Installing the IBM Forms Experience Builder portlet Adding the Forms Experience Builder Portlet to a Portal Page Configuring the Forms Experience Builder Portlet Passing Portal User Information to a FEB Application Introduction Forms Experience Builder makes creating forms easier than before by dramatically reducing the time and effort required to deliver compelling, interactive applications. The simple web-based user interface allows any Web designer to quickly assemble a series of application screens, capture data into a relational database, and orchestrate notifications using an integrated workflow. Forms Experience Builder is the newest addition to the IBM Forms product suite. Version 8.0 is the first release of the product. The following list is a summary of the features and benefits of Forms Experience Builder: Agile and easy to use Allows business to respond without expensive, time-consuming development cycles. 100% standards-based Lowers TCO and leverages common IT skills. Highly performant Meets the needs of today s customer, partner and citizen-facing deployments. Compelling user experience Leverages best-of-breed, Web 2.0 technologies such as CSS, Dojo, and JavaScript. Easy integration Complements SOA, BPM and other line-of-business systems Page 4 Integration Between WebSphere Portal and Forms Experience Builder
Web-based interface All users access Forms Experience Builder through the web. Design applications online, deploy them, then provide users with the URL of your application. Users access applications without special software installation required. Built-in workflow capabitilites Create time sheet, or vacation approval forms and set up workflows for manager approval. In one product, you can design the form, set the permissions, and have users submit forms. Organize, review and export data When users submit forms, the results are available to users with the appropriate permission levels. You can search through results, organize them, and export them to a spreadsheet program for further review. Drag-and-drop form design Select items from the Palette and place them on your form. Items are automatically lined up with one another. Flexible layout You can stretch any form item in the form to span rows and columns. You can also put sections within sections. Accessibility The Forms Experience Builder interface is fully accessible, allowing form design through keyboard shortcuts rather than using the mouse. Accessible forms are easier to create as tab order is set by the location of items on the form. Integration Prerequisites (Complete if you skipped Lab: Creating An Expense Report Application ) If you skipped the Creating An Expense Report Application lab you need login into Forms Experience Builder and import the Expense Report. Follow these steps to import the Expense Report lab for deployment instructions. 1. Importing the Expense Report application. Launch Forms Experience Builder with URL http://portal.ibm.com:10039/forms 2. Under Manage select Import Forms Experience Builder Page 5
3. browse to C:\Lab Files\FEB lab\expensereport.nitro_s, Click Open 4. Select Deploy Application? Click OK. Duration You should be able to complete this lab in approximately 60 to 90 minutes. Page 6 Integration Between WebSphere Portal and Forms Experience Builder
Integration Between WebSphere Portal and Forms Experience Builder To complete this lab, you will need to run the Forms 8.0 VMware image which also includes Form Experience Builder. Follow these instructions to get started. 1. Login into the image as: user: Administrator password: pa$$w0rd (with a zero) 2. Start the Portal server by using the Start Portal icon located on the Desktop. Please note that starting the Portal server will take a few minutes. 3. While Portal is starting you can continue reading the lab as the first section (integration prerequisites) was already configured for you so this is mainly for your information. 1.1 Integration Prerequisites (Completed) The following prerequisites to integrate WebSphere Portal and Forms Experience Builder have already been completed on the image for your convenience. The information on this section is very important if setup this environment and will need to complete these prerequisites for configuring the Forms Experience Builder Portlet configuration in your environment. This Lab starts in the next Section 1.2. 1.1.1 Forms Experience Builder (FEB) Installation (Completed Prerequisite) Forms Experience Builder must first be installed before it can be integrated with WebSphere Portal. You can read about the installation procedure here: Installing Forms Experience Builder http://www-10.lotus.com/ldd/lfwiki.nsf/dx/installing_forms_experience_builder_feb_8 1.1.2 Single Sign-on (SSO) Between Portal and FEB (Completed Prerequisite) Another prerequisite is that SSO must configured between Forms Experience Builder and WebSphere Portal. In this image, Forms Experience Builder was installed directly on top of the Portal server so this step is not required. For more information regarding configuring Single Sign-on please see the WAS documentation. Forms Experience Builder Page 7
1.1.3 Setting up the proxy configuration in WebSphere Portal (Completed Prerequisite) To use a Forms Experience Builder application in WebSphere Portal, you must configure the WebSphere Portal Ajax Proxy to allow communication from the web browser to Forms Experience Builder. For detailed instructions on configuring the WebSphere Portal Ajax Proxy for FEB please see: http://www- 10.lotus.com/ldd/lfwiki.nsf/dx/Before_installing_the_IBM_Forms_Experience_Builder_portlet_in_WebSphere_Portal_FEB_8 The following steps describe how to configure the WebSphere Portal Ajax Proxy prior to installing the Forms Experience Builder portlet. Prepare the proxy file: The proxy-config.xml This file is located in a separate enterprise application deployed during WebSphere Portal installation. The corresponding enterprise application archive is named AJAX Proxy Configuration.ear. The proxy-config.xml file representing the global configuration is located in the WAR file wp.proxy.config.war, and is located in the WEB-INF directory. Using explorer, navigate and and locate the AJAX proxy-config.xml The global proxy configuration is located at: C:\IBM\WebSphere\wp_profile\config\cells\portalCell\applications\AJAX Proxy Configuration.ear\deployments\AJAX Proxy Configuration\wp.proxy.config.war\WEB-INF Select the file and make a copy of the proxy-config.xml file and place it in C:\temp Page 8 Integration Between WebSphere Portal and Forms Experience Builder
Locate the corresponding proxy-config-portal-x.xml FEB proxy file located in the Forms Experience Builder installation directory: < install directory install directory /deploy/portlet/proxy-config-portal-x.xml>, where x represents your version of WebSphere Portal. On our lab Portal 8.0 lab server this file is located in: C:\IBM\FormsServer\8.0\ExperienceBuilder\deploy\portlet Select the.xml file, right click and Edit the file with Notepad (or your preferred text editor) and copy the file contents to the clip board using the key sequences Ctrl-A, Ctrl-C: Forms Experience Builder Page 9
The proxy-config-portal-8.xml file contains the following information: <?xml version="1.0" encoding="utf-8"?> <proxy-rules xmlns:xsi="http://www.w3.org/2001/xmlschema-instance" xmlns="http://www.ibm.com/xmlns/prod/sw/ajax/proxy-config/1.1"> <policy url="{$formsexperiencebuilder_url_policy}" acf="none"> <actions> <method>get</method> <method>head</method> <method>post</method> <method>put</method> <method>delete</method> </actions> <cookies> <cookie>ltpa</cookie> <cookie>ltpa2</cookie> <cookie>jsessionid</cookie> <cookie>ltpatoken</cookie> <cookie>ltpatoken2</cookie> <cookie>simpletoken</cookie> </cookies> <headers> <header>x-lfn-url-callback</header> <header>user-agent</header> <header>accept*</header> <header>vary</header> <header>location</header> <header>content*</header> <header>authorization*</header> <header>x-method-override</header> <header>set-cookie</header> <header>if-modified-since</header> <header>if-none-match</header> <header>x-server</header> <header>x-update-nonce</header> <header>x-requested-with</header> <header>com.ibm.lotus.openajax.virtualhost</header> <header>com.ibm.lotus.openajax.virtualport</header> </headers> </policy> </proxy-rules> Page 10 Integration Between WebSphere Portal and Forms Experience Builder
Update the policy URL from "{$formsexperiencebuilder_url_policy}" to the location of your Forms Experience Builder server. For example: http://server:port/forms/*. In our lab FEB is configured URL http://portal.ibm.com:10039/forms so we changed the line <policy url="{$formsexperiencebuilder_url_policy}" acf="none"> to <policy url="http://portal.ibm.com:10039/forms/*" acf="none"> Copy the proxy-config-portal-8.xml changes to the clipboard. Open C:\temp\proxy-config.xml in a text editor and insert/paste the changes into the proxyconfig.xml XML proxy text below another policy url section closing tag </policy> but inside the closing tag </proxy-rules>. For example: <policy url="{$resource_manager_policy}" acf="none" basic-auth-support="true"> <actions> <method>get</method> <method>put</method> <method>head</method> </actions> <headers> <header>user-agent</header> <header>content*</header> <header>accept*</header> <header>pragma</header> </headers> <mime-types> <mime-type>text/xml*</mime-type> <mime-type>application/xml*</mime-type> <mime-type>application/atom+xml*</mime-type> <mime-type>application/rss+xml*</mime-type> <mime-type>application/octet-stream*</mime-type> </mime-types> <meta-data> <name>forward-credentials-from-vault</name> <value>true</value> </meta-data> </policy> <?xml version="1.0" encoding="utf-8"?> <proxy-rules xmlns:xsi="http://www.w3.org/2001/xmlschema-instance" xmlns="http://www.ibm.com/xmlns/prod/sw/ajax/proxyconfig/1.1"> <policy url="http://portal.ibm.com:10039/forms/*" acf="none"> <actions> <method>get</method> <method>head</method> <method>post</method> <method>put</method> <method>delete</method> </actions> <cookies> <cookie>ltpa</cookie> <cookie>ltpa2</cookie> <cookie>jsessionid</cookie> <cookie>ltpatoken</cookie> Forms Experience Builder Page 11
<cookie>ltpatoken2</cookie> <cookie>simpletoken</cookie> </cookies> <headers> <header>x-lfn-url-callback</header> <header>user-agent</header> <header>accept*</header> <header>vary</header> <header>location</header> <header>content*</header> <header>authorization*</header> <header>x-method-override</header> <header>set-cookie</header> <header>if-modified-since</header> <header>if-none-match</header> <header>x-server</header> <header>x-update-nonce</header> <header>x-requested-with</header> <header>com.ibm.lotus.openajax.virtualhost</header> <header>com.ibm.lotus.openajax.virtualport</header> </headers> </policy> </proxy-rules> Insert/Paste the following lines in proxy-config.xml the meta data section: <meta-data> <name>forward-http-errors</name> <value>true</value> </meta-data> Save and close the proxy-config.xml and leave it in the C:\temp folder Configure the proxy using the ConfigEngine.bat file: On Windows :wp_profile\configengine\configengine.bat -DWasPassword=<wasAdminPass> -DPortalAdminPwd=<portalAdminPass> checkin-wp-proxy-config -DProxyConfigFileName=<Path to proxy-config.xml file> Page 12 Integration Between WebSphere Portal and Forms Experience Builder
Open the Windows command prompt and switch to the following folder: C:\>cd C:\IBM\WebSphere\wp_profile\ConfigEngine Run the ConfigeEngine.bat file pointing to the updated proxy-config.xml file in C:\temp using the following parameters: C:\IBM\WebSphere\wp_profile\ConfigEngine>ConfigEngine.bat -DWasPassword=passw0rd -DPortalAdminPwd=passw0rd checkin-wp-proxy-config -DProxyConfigFileName=C:\temp\proxyconfig.xml Go to the WAS console for Portal. Navigate to Resources -> Resources Environment -> Resources Environment Providers -> WP ConfigService -> Custom properties. Add a custom property called wp.proxy.config.urlreplacement.formsexperiencebuilder_url_policy.1 The value of the property is the URL to server hosting Forms Experience Builder. For example: http://< server>:port/forms/*. Save your changes Restart WAS/Portal then proceed to the next section to configure the FEB portlet. Forms Experience Builder Page 13
1.2 Installing the IBM Forms Experience Builder portlet Installing the Forms Experience Builder portlet allows you to use Forms Experience Builder applications in WebSphere Portal. The Forms Experience Builder portlet is available as a standard portlet WAR file and the installation is done using the WebSphere Portal Administration Console. 1. 2. Make sure Portal has started successfully Login into WebSphere Portal (there is a shortcut on the Desktop) 3. When prompted, enter the following credentials to login: User ID: Password: wpadmin passw0rd (with a zero) 4. Go into Administration area 5. Go to Portlet Management > Web Modules 6. Click Install Page 14 Integration Between WebSphere Portal and Forms Experience Builder
7. Click Browse, and go to the following directory: C:\IBM\FormsServer\8.0\ExperienceBuilder\deploy\portlet Important! Use the correct path. There are two folders C:\IBM\FormsServer (FEB) and C:\IBM\Forms Server (Classic Forms). Be sure to use the FEB folder. 8. Select forms-experience-portlet.war and click Open 9. 10. 11. Click Next to continue All default values on the page are acceptable and should not be changed. Click Finish. Once the FEB portlets are installed you should see a message like this: Forms Experience Builder Page 15
1.3 Adding the FEB portlet to a Portal Page To use Forms Experience Builder applications within WebSphere Portal, you must add the Forms Experience Builder portlet to the WebSphere Portal page. In this section we will create a new Portal page and add an existing FEB application as a portlet to that page. 1. Under Administration, select Portal User Interface > Manage Pages 2. Select Content Root under Manage Pages 3. Select Home Page 16 Integration Between WebSphere Portal and Forms Experience Builder
4. Click New Page 5. Under Title, enter Expense Report 6. 7. Leave all the other default values and press OK to create the page Go to the newly created page by selecting Home and then Expense Report Forms Experience Builder Page 17
8. In the upper right of the page select Edit Mode to modify the page's contents 9. 10. 11. Go to the Content tab and select All from the category list. Enter Forms Experience Builder into the search box and click the magnifying glass to begin the search. The Forms Experience Builder Portlet box is shown as a search result. 12. 13. Add the portlet by: either clicking Add to Page + button or by dragging and dropping the portlet into place. Click Save to save your changes. 14. Now that we are done adding the Forms Experience Builder portlet to the page the next step is to configure it. Page 18 Integration Between WebSphere Portal and Forms Experience Builder
1.4 Configuring the Forms Experience Builder Portlet After the Forms Experience Builder portlet is installed into a WebSphere Portal page, you must configure it to define Forms Experience Builder and WebSphere Portal Ajax proxy locations. To configure the portlet, you must have Administrative privileges. Ensure the WebSphere Portal page is in Edit mode. 1. Click the menu icon located to the right of the portlet name, and select Configure. 2. 3. Update the values on the Configure page as follows: Forms Experience Builder URL: http://portal.ibm.com:10039/forms This is the full URL for the location of your Forms Experience Builder installation. Note: If you are doing this on your own sever installation, make sure that this URL match the wp.proxy.config.urlreplacement.forms_url_policy.1 configuration value you set in the WebSphere Portal Ajax proxy properties. Important! If you copy the URLs from this lab for the Portal Configuration be sure remove the prepended 1. http://portal.ibm.com:10039/forms since the 1. is copied to the clipboard as well and your Portlet will not function properly. 4. Portal Proxy URL: http://portal.ibm.com:10039/wps/proxy This is the full URL to the WebSphere Portal Ajax proxy. Forms Experience Builder Page 19
5. 6. 7. 8. Click OK to save your changes Next, you are going to select the Forms Experience Builder application you want to use in your Portal page. While the page is still in Edit mode, click the menu icon located to the right of the portlet name, and select Edit Shared Settings. The Shared Settings page opens: 9. 10. 11. You now need to update the values on the Edit Shared Settings page. Press Browse Applications to see the list of deployed applications in Forms Experience Builder. Select the application Expense Report, which was created in the earlier Forms Experience Builder lab. NOTE: If you skipped the Creating An Expense Report Application lab you need login into Forms Experience Builder and import the Expense Report the instructions are on Page 5 under Integration Prerequisites. Page 20 Integration Between WebSphere Portal and Forms Experience Builder
12. 13. Click OK You should now see the Expense Report application appear within the Forms Experience Portlet. Forms Experience Builder Page 21
14. Since the application was designed to use a wider screen, go to the Layout Tab and select the 1 Column layout: 15. Save the changes to the page 16. Return to View Mode to view the Portal page the way the end user completing the Expense Report would see it. 17. 18. 19. Go ahead complete an Expense Report and Submit it. You can then login into Forms Experience Builder to view the submitted entry. Forms Experience Builder with URL http://portal.ibm.com:10039/forms and Click View Responses Stop the Portal Server and enter the credentials at the prompt. Enter wpadmin and passw0rd credentials and wait until it successfully stops. Page 22 Integration Between WebSphere Portal and Forms Experience Builder
1.5 Integration with Portal User Information Another important integration feature is the ability to pass Portal user information into the Forms Experience Builder application. Since the use is already logged into Portal by the time the FEB application is loaded into Portal, we can use the user credentials to query the Portal PUMA services for additional user information such as their full name. To do this, we first need to configure the PUMA services in FEB as shown in this section. 1.5.1 Configuring the PUMA Services 1. If it is not already created, make the directory C:\IBM\Forms\ServiceCatalog\1. Using explorer, navigate to the folder C:\Lab Files\FEB lab\ directory right-click on the file PUMA_service.zip and unzip the files to C:\IBM\Forms\ServiceCatalog\1 2. Extract as shown below and click OK 3. In C:\IBM\Forms\ServiceCatalog\1, locate and Right-click on the file named Get Current Portal User Information.xml and select Open with Notepad Forms Experience Builder Page 23
4. Below 4. Deploy, change the value under the request-url id <value> to the following: http://portal.ibm.com:10039/wps/um/secure/currentuser/profile as shown here: 5. 6. Save the file and exit Notepad. Start Portal if it is not running, or you must now restart Portal for the new PUMA service to take effect. Page 24 Integration Between WebSphere Portal and Forms Experience Builder
1.5.2 Adding User Information to the Expense Report Application Now that Portal has been restarted, you need to login into Forms Experience Builder to modify the Expense Report application in order to add the newly configured Portal User Information service. 7. 8. Once Portal has started successfully, login to Forms Experience Builder with URL http://portal.ibm.com:10039/forms as user: wpadmin with password: passw0rd, While in FEB's Manage Tab, click Edit under the Expense Report application. 9. You may get a warning like the one below, saying that since the application is already deployed. Just click Yes to continue. 10. Select the Access tab, under Assigned Users select Sales, in the Add Users click the green + button next to All Authenticated Users Group to add this group to Role Members Forms Experience Builder Page 25
11. Under the Setting tab, Select Services Expense Report and Add Service Configuration Page 26 Integration Between WebSphere Portal and Forms Experience Builder
12. Select the Get Current Portal User Information service, click OK 13. You should now see the Service 14. Select the Forms tab, and on the top-right section of the screen next to Expense Report, click on the Edit Form Properties icon as shown below: 15. 16. On the Edit Form Properties screen, go to the Advanced Tab Scroll down and select the checkbox next to Call a service to pre-populate Forms Experience Builder Page 27
17. Under the On display of new form dropdown, select the service named Get Current Portal User Information as shown below: 18. Click the Add/Edit Service Configuration link as shown: 19. 20. 21. 22. In the Service Configuration screen, select the Outputs Tab Under Select source on the left, select Full Name Under Select target on the right, expand Basic Information and select Name Page 28 Integration Between WebSphere Portal and Forms Experience Builder
23. Click the Assign Output button (located in the middle of the screen) as shown below: 24. Now you should see the following line on the screen: 25. 26. Click OK to save the service configuration Click OK again to save the form properties 27. Save the application 28. Switch back to the FEB Manage Tab Forms Experience Builder Page 29
29. Under Expense Report click on Deploy 30. 31. You will see a message showing you the deployment settings. Just hit Update to deploy the application. 32. Log Out from FEB 1.5.3 Testing the Puma Service The last section of this lab is just verifying that the new Get Current Portal User Information service works correctly. 33. 34. Double-click the Portal Login shortcut on the Desktop Select Login using User ID: abauer with Password: passw0rd Page 30 Integration Between WebSphere Portal and Forms Experience Builder
35. Under Home, select the Expense Report link to load the application. You should see the name Anna Bauer appear in the Name field as shown below. ( wait few seconds for it to load as you may see an empty field first) 36. 37. That's it. You have verified that the service is working. Congratulations, you have completed this lab!!! Forms Experience Builder Page 31
1.6 Summary In this lab, you have learned how to configure the integration between WebSphere Portal and Forms Experience Builder, as well as how to design and configure a Forms Experience Builder application that can retrieve Portal user information. Specifically, some of the things you have experienced on this lab are: Installed the IBM Forms Experience Builder portlet Added the Forms Experience Builder Portlet to a Portal Page Configured the Forms Experience Builder Portlet Added Portal User Information service to FEB Passed Portal User Information to a FEB Application Page 32 Integration Between WebSphere Portal and Forms Experience Builder
Additional Resources IBM Forms Experience Builder Documentation http://www-10.lotus.com/ldd/lfwiki.nsf/xpviewcategories.xsp?lookupname=forms%20experience %20Builder%208%20documentation System Requirements for IBM Forms Experience Builder http://www-01.ibm.com/support/docview.wss?rs=3325&uid=swg27024231 Installing Forms Experience Builder http://www-10.lotus.com/ldd/lfwiki.nsf/dx/installing_forms_experience_builder_feb_8 Configuring IBM Forms Experience Builder http://www-10.lotus.com/ldd/lfwiki.nsf/dx/configuring_ibm_forms_experience_builder_feb_8 Administering Forms Experience Builder http://www-10.lotus.com/ldd/lfwiki.nsf/dx/administering_forms_experience_builder_feb_8 Installing the IBM Forms Experience Builder Portlet http://www-10.lotus.com/ldd/lfwiki.nsf/dx/installing_the_ibm_forms_experience_builder_portlet_feb_8 Configuring the IBM FEB Portlet on the WebSphere Portal page http://www- 10.lotus.com/ldd/lfwiki.nsf/dx/Configuring_the_IBM_Forms_Experience_Builder_portlet_on_the_WebSp here_portal_page_feb_8 Configuring IBM Forms Experience Builder portlet with other portlets http://www- 10.lotus.com/ldd/lfwiki.nsf/dx/Configuring_IBM_Forms_Experience_Builder_portlet_with_other_portlets_ FEB_8 Forms Experience Builder Page 33
NOTES
Copyright IBM Corporation 2012 The information contained in these materials is provided for informational purposes only, and is provided AS IS without warranty of any kind, express or implied. IBM shall not be responsible for any damages arising out of the use of, or otherwise related to, these materials. Nothing contained in these materials is intended to, nor shall have the effect of, creating any warranties or representations from IBM or its suppliers or licensors, or altering the terms and conditions of the applicable license agreement governing the use of IBM software. References in these materials to IBM products, programs, or services do not imply that they will be available in all countries in which IBM operates. This information is based on current IBM product plans and strategy, which are subject to change by IBM without notice. Product release dates and/or capabilities referenced in these materials may change at any time at IBM s sole discretion based on market opportunities or other factors, and are not intended to be a commitment to future product or feature availability in any way. IBM, the IBM logo, and ibm.com are trademarks of International Business Machines Corp., registered in many jurisdictions worldwide. Other product and service names might be trademarks of IBM or other companies. A current list of IBM trademarks is available on the Web at Copyright and trademark information at www.ibm.com/legal/copytrade.shtml.