Java Magazine - November/December 2011

should now look like Listing 1.
c. Select the Source Package node of
the AuctionApp project and open
the SellerResource.java file located
in the package com.bonbhel.oracle
. auctionApp.resource.
d. Remove the XML MIME type
(application/xml) from the
@Produces annotation of the
method get() to handle the JSON
response only. The class should
now look like Listing 2.
e. Repeat Steps b, c, and d for each
resource.

2. Test the JSON and XML response
format:
a. Build and deploy the project.
b. To test the JSON response, open
your browser and type the re-
source URL http://localhost:8080/
AuctionApp/resources/sellers/.

The JSON representation of the resource (Sellers) will be displayed. You can see all the Sellers that you already created in JSON format. Save the result when prompted by your browser and open the saved file with any text editor to see the JSON string.

If you see the result shown in Listing 3, it means your RESTful services are working correctly. Now that the RESTful Web services are up and running, we are ready to consume them using any client.

@Path("/sellers/")

@Stateless public class SellersResource { @javax.ejb.EJB private SellerResource sellerResource;

@Context . . . .

@GET @Produces({"application/json"}) public SellersConverter get(@QueryParam("start")

@DefaultValue("0")

...

COMMUNITY JAVA IN ACTION

See all listings as text

source URL http://localhost:8080/
AuctionApp/jsonUI/ JsonClient.html.
b. Enter the seller ID ( 2).
c. Click Load seller in local browser.
A confirmation message is displayed.
2. Display the stored information:
a. Retrieve the information for seller
#2 from the local storage by click-
ing Read Values.
The first name and last name of seller
#2 are displayed.
b. Now you can smile—it works!

handle and parse the JSON message sent by the Web service. Finally, HTML5 provides very cool functionalities for storing the data in your browser and accessing the data with JavaScript after the page is loaded. This allows us to save time and bandwidth.

In Part 3 of this series, we will focus on the integration of Java API for XML Web Services (JAX-WS) technology for “big” Web services. </article>

ABOUT US

Using an HTML5 Client We need to use a Web client. So we are going to quickly build a sample HTML5 page front end to allow us to perform the following tasks using HTML, JavaScript, and Ajax functionalities:

■ ■ Call the Web services for the Seller.

■ ■ Store the Seller’s information on the browser (HTML5 capability). The concept works like the cookies in your browser, but it’s recommended for larger data.

■ ■ Retrieve the information stored in the browser.

■ ■ Finally, display the information.

JavaScript will be used to invoke the Web service via the XMLHttpRequest object provided by Ajax technology.

1. Create a sample HTML page:
a. Right-click the Web Pages node of
the AuctionApp project and select
New; then select HTML.
b. Type an HTML filename, such as
A new resources HTML file is added to
the project.

2. Edit the created page and modify the HTML <body> tag, as shown in Listing 4.

3. Add the JavaScript functionality to invoke the Web services and handle the data storage by modifying the HTML <head> tag, as shown in Listing 5.

4. Retrieve and display the stored
information:
shown in Listing 6.
b. Save the HTML file.
c. Build and deploy the project.

blog

Testing the HTML Client Application

1. Call the Web services for seller #2: a. Open your browser and type the re-

Conclusion We have seen how easy it is to configure RESTful Web services to send a JSON response to the client. The integration of JavaScript and Ajax made it easy to