Application Download: https://www.dropbox.com/s/7d0k9cqhf2sqhoj/MobileApp.zip
Use Case Scenario
This is part II of the “Verify User – JSON REST API” we created and previously deployed. This is just a simple HTML5 jQuery mobile application wrapped as a standard J2EE application and deployed onto the same server as the REST service.It is a simple login page that invokes the REST service to determine whether the user is authenticated or not. It doesn’t encrypt/decrypt the password. It’s just to demonstrate that you can leverage these REST services in any type of application. We could easily use this same REST service in our ADF portal application or a standard portlet. It doesn’t matter …
In this application you can enter any user in the HR schema Employees table with the password “welcome1” and it will authenticate. In this demonstration we’ll use SKING (mixed case works fine). If authentication fails it takes them to an ERROR dialog page (still inside the same page). If it passes the user is taken to a private page “welcome.jsp” (This is not really protected).
If you’ve kept up with ADF Mobile the next release (PS6) is supposed to support a better HTML5, JQuery, PhoneGap, etc. etc. to provide a quicker template solution for mobile development within the ADF techstack.
Part II: The Mobile App
I started out by creating a “Generic Application” and a “Generic Project” with Java, JSP and Servlet technology added to it.I created a couple of standard JSP pages:
- Login.jsp
- I’m using a standard HTML5 JQuery Mobile template layout to leverage multiple display sections in a single page. If you look through the code you’ll notice:
- Main Content
- This is my main page displayed to the user and has the username, password, and submission button.
- Content Dialog
- This is the dialog section that notifies the user that there was an issue with their login. Once they return to the main content the fields that are required are highlighted.
- Content Error Dialog
- This is the dialog section that notifies the user that there was an issue with their login. If the user is not found they must enter the username/password again.
- Content Transition
- If your REST service takes a while (this shouldn’t) this portion of the content will display with an animated gif to show the user the transaction is in progress.
- /priv/welcome.jsp
- This is a standard page that lets the user know that the login was successful and they can log out if they wish to do so.
Once you deploy the application you should be able to run it using the URL below:
http://localhost:7101/MobileApp/login.jsp